技術推進室の色川です。 ここ一年くらいランキングシェアというキュレーションメディアのフロントエンドを担当しています。その記事作成画面をReactで実装しており、先日アイテムの移動をDrag&Dropで行えるようにしたのですが、動きはガクガク、ブラウザは途中で固まる、という有様で、パフォーマンスチューニングを余儀なくされたのでその内容を紹介します。 [ランキングシェアの記事作成画面] ※画面は開発中のものです。(動画にしたら?との意見があったのですが、Windowsで画面を録画する方法が分からず…) Reactのパフォーマンス改善の基本Reactはコンポーネントをツリーとして管理していて、あるコンポーネントの更新が必要になるとそのコンポーネントをルートとするサブツリー全体を更新します。 引用元:Reactive, Component-based UIs with React | Consta
reactでfluxやってるとあのサイクルを回すのが面倒くさくなりませんか?僕はなりました。 そこでbaobab-reactです。 ┌────────────────────┐ ┌──────────── │ Central State │ ◀───────────┐ │ │ (Baobab tree) │ │ │ └────────────────────┘ │ Renders Updates │ │ │ │ ▼ │ ┌────────────────────┐ ┌────────────────────┐ │ View │ │ Actions │ │ (React Components) │ ────────Triggers───────▶ │ (Functions) │ └────────────────────┘ └────────────────────┘ 1周がこんな感じで回っ
HandlerベースのAPIで非同期HTTP通信を試す 前回は、非同期HTTP通信を行うためのJava用クライアントライブラリ「AsyncHttpClient」を紹介した。AsyncHttpClientには、非同期HTTP通信を行うための方法として2種類のAPIが用意されており、前回解説したのはそのうちのFutureベースのAPIの使い方である。今回は、もうひとつの方法であるHandlerベースのAPIについて紹介する。 HandlerベースのAPIでも、最初にAsyncHttpClientのインスタンスを生成し、prepareXXX()メソッドを用いてリクエストを生成する部分までは同様である。FutureベースのAPIの場合はこのprepareXXX()メソッドの戻り値に対して引数なしのexecute()メソッドを実行したが、HandlerベースのAPIでは、execute()の引数とし
ハッピーターンを食べていた次女(2才)が、ウエットティッシュを欲しがりました。ハッピーターンには、ハッピーパウダーという、人を虜にさせる魔法の粉がついています。おそらくその粉が手についたのをふきたいのだろうと思って、ウェットティッシュをわたしました。 すると、なんということでしょう。手ではなく、ハッピーターンについているハッピーパウダーを一生懸命ウェットティッシュでふきはじめたではないですか!おせんべいについている粉をふくべきものとみなし、おせんべいをふいてしまったのです! 「その粉が美味しいのになんということをしてくれるのだ!」と衝撃を受け内心身もだえました! ウェットティッシュで丹念にふかれたハッピーターンには、もはやハッピーを見出すことができませんでした。ハッピーパウダーには、本当に人をハッピーにする魔法が入った粉であると私は信じています。 *PR* 2016年5月8日に発売しました
http://qiita.com/mizchi/items/3bbb3f466a3b5011b509 で紹介したモダンJSスタックの上に、flowtype を導入して型をボトムアップに追加していくアプローチを紹介します。 なぜflowtypeか、そのゴールは 流行っているライブラリのみを組み合わせて使う場合や、バックエンドとの連携において型が十分に提供される環境なら、正直、flowtypeよりtypescriptでいいと思っています。flowtypeが力を発揮する環境は、既存のJSが大量に存在する環境や、railsなどの動的な型のフレームワーク環境で、静的な定義が抽出できない環境だと思います。 よほど品質が低いライブラリを使わないかぎり、バグはほとんど自分が記述したコードによって発生します。なので、まずは「自分が書いたコードのIFを明確にし、その静的なチェックを行なう」、というのを最初の目
最近はエンタープライズのシステムでも、Web APIによるシステム間連携が増えてきました。そうしたときに、1リクエストで複数の連携先APIを実行し、結果をクライアントに返すということがままあります。 どう作りましょうか、という問題です。 前提として、サーバサイドでHTMLレンダリングせずに、Web APIの中継することとします。中継する意義は、流量やキャッシュをサーバサイドでコントロールできるところにあります。 クライアントから直接連携先のAPIにアクセスする設計にすると、リロードボタン連打などのDDoS攻撃うけたときに、自分たちでは対処できず、連携先に迷惑をかけてしまいますよね。特に「課金の関係などで直接APIをアクセスしなきゃいけないんだ」、とかでなければ、中継するように設計しておいた方がベターです。 Web APIの呼び出し 業務システムで使う場合は、ちゃんとリクエスト、レスポンスが
2016 - 03 - 22 薄っぺらい記事が拡散中!あなたは炎上しないと注目されないのか? 世間 世間-批判・疑問 Twitter Google Pocket 広告 はあちゅう 公式ブログ - 旅で人生が変わったとか言う人は中身がゼロなのです - Powered by LINE このブログが 炎上 していますね。記事タイトルは「旅」ですが、内容を見る限り「世界旅行」を指しているようです。 言及記事要約 各部分への所感 全体として僕が感じたこと 拡散されるようなコンテンツではない 自分の価値が相対的に揺らぐ不安定さを感じる 世界旅行は人生観を変えるかもしれない まともなコンテンツで拡散されましょうよ(あとがき) 言及記事要約 〈ツイート〉海外へやたら行く自己啓発系アピーラーより一つのところで淡々と仕事をする方がクリエイティブだと思う 〈ツイート〉海外は外部からの刺激だけど、目の前の仕事から
進捗どうですか? 新年を迎えてからしばらく経ち、皆様当初の目標からの進捗はいかがでしょうか? 僕は全くダメです。 やりたいこと、やらないといけないなと思ってることは沢山あるんですが、「何をしようかなぁ」と考えているうちに、気づけば寝ていたり、気づけばデレステをやってる毎日です。マキノかわいい。 世の中にはタスク管理の手法は色々ありますが、それらはすべて「タスクをこなす意思がある人向け」であり、僕みたいな意思の弱い人間が、あれとこれをやりたいとリストアップしたところで、そのリストを前にした時点でうんざりしてしまうのは必然です。 リストを前にすると尻込みしてしまう。であれば、目に見えるタスクを一つだけにしてしまえばいい。 導入が長くなりましたが、そんなモチベーションから「タスクを一つ選び出すツール」を作ったお話です。 どんなアプリケーションを作ったか こちらになります。 https://gac
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く