FRESH! Web パフォーマンス改善 〜クライアントサイド編〜 | CyberAgent Developers Blog
You can read this post in English. みなさんこんにちは、FRESH! でフロントエンドの開発している鈴木(sutiwo)です。 前回は、FRESH!におけるPCブラウザのFlash脱却という HLS の Web プレイヤーについて記事を書きました。 今回はスマートフォン・ PC でのブラウザに関するパフォーマンス改善の取り組みとその結果についてお知らせします。 まずクライアントサイドのパフォーマンス改善を行うにあたり、弊社の Web Initiative Center* から 1000ch 氏に加わっていただきどのようなことを目標とするか議論しました。 * Web プロダクトの品質向上とWeb技術を使ったチャレンジを目的に設立された弊社の組織 議論の様子 議論を行った後、今回の改善で以下のことに取り組むことが決まりました。 Service Worker で
Chrome DevToolsを使ってJavaScriptのメモリリークを検出し、解消する - 人生dat落ち
JavaScriptを書いていたらブラウザがくっそ重くなる症状に出くわした。あぁ、噂のメモリリークですわ。 先人の知恵に頼るマン。それっぽい記事が見つかる。 javascriptのメモリリーク対策(随時更新) - Qiita Shibu’s Diary: JavaScriptのメモリリークを10倍速で発見する Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools Writing Fast, Memory-Efficient JavaScript - Smashing Magazine angularjs - How to catch memory leaks in an Angular application? - Stack Overflow 上の記事はProfiles + Take Heap
PHP7はなぜ速いのか（zval編） - hnwの日記
この記事はPHP Advent Calendar 2014の7日目です。 僕は先日のPHPカンファレンス2014でPHP7に関するLTをしました（参照：「PHPNGの動向」）。ただ、時間が限られていたこともあり、あまり踏み込んだ内容には触れませんでした。 本稿ではLTの内容から深掘りし、zvalという内部的な構造体がどう変わるのか、性能面のメリットにフォーカスして解説してみます。 PHPをとりまく状況 まず最近のPHPの話題をおさらいしておきましょう。 これまでPHPには実用レベルの別実装が存在しない状態が続いていましたが、HHVMの登場で状況が変わってきました。HHVMはFacebookが開発しているPHP実行環境で、PHPより高速で互換性も高いのが特徴です。Facebookで実際に利用されているだけでなく、他の企業でも商用サービスで利用する事例が増えてきています。 そんな中、2014年
開発者のためのSQLパフォーマンスの全て
前書き - インデックスの作成はなぜ開発者のタスクなのか インデックスの 内部構造 - インデックスは何に似ているか インデックス リーフノード - 二重連結リスト 検索 ツリー(Bツリー) - バランス木 遅いインデックス パートI - インデックスを遅くする2つの原因 where 句 - 検索のパフォーマンスを改善するためにインデックスを作成 等価 演算子 - 一致するキーの検索 プライマリキー - インデックスの使い方を確認 複合インデックス - 複数列に対するインデックス 遅いインデックス パートII - 前の問題点が再び 関数 - where句の 中での関数 大文字・小文字を区別する 検索 - UPPERと LOWER ユーザ定義 関数 - 関数インデックスの制限 インデックスの作り過ぎ - 冗長性の排除法 パラメータ化 クエリ - セキュリティとパフォーマンスのために 範囲 検
<script async>でJavaScriptの非同期読み込みを - fragmentary
JavaScriptファイルをスクリプトから非同期で読み込むパターンは古い、という話を目にしたのはもう半年前のこと。 言ったのはIlya Grigorik。月末のGoogle Japanでのイベント、月初のHTTP2ConferenceにくるWebパフォーマンス界のすごいひとですよ。 Script-injected "async scripts" considered harmful - igvita.com 件のパターンは、スクリプトで動的に script を生成して、そこに読み込みたいJavaScriptファイルをぶっこんで読み込むというもの。 <script> var script = document.createElement('script'); script.src = "//somehost.com/awesome-widget.js"; document.getEleme
curlでボトルネック調査をする - 256bitの殺人メニュー
ますだっくすさんが curlのエントリ書いてたのでおいらも1つだけ追記しませう。 Webサイトのボトルネック調査 あるサイトでアクセスが遅いなぁ、って話になったときにまず当たりをつけるために遅い部分を調べたい。 って時のcurlの使い方。 実際の手順 基本的には、前述のますだっく（@masudak）さんの、「その3. レスポンスの出力を加工する」であるのですが、詳細な項目を設定することで問題の切り分けにも使用できます。 出力フォーマット用のファイル。 cat <<'EOF' >/tmp/curl_env.txt url_effective\t\t: %{url_effective}\n http_code\t\t: %{http_code}\n http_connect\t\t: %{http_connect}\n time_total\t\t: %{time_total}\n time_
Cacoo - Web上で図の作成とリアルタイムコラボレーション
Online diagramming tool for collaborating on wireframes, flowcharts, and more
クライアントサイド JavaScript のパフォーマンス改善には backburner.js が便利！ - tricknotesのぼうけんのしょ
DOM 処理や Ajax など、JavaScript が外の世界とやり取りする部分というのは、一般的に待ち時間を多く必要とします。 パフォーマンスを改善しようと思った時に、ロジック部分でコツコツと節約するより、まずコストが高い処理を行わないようにするということで、驚くほどの効果を経験をされたことはありませんか？ 今までパフォーマンス測定をされた方であればピンとくる部分があることと思います。 そんな時に役に立つのが、今回ご紹介する backburner.js です。 ebryn/backburner.js - GitHub backburner.js って? backburner.js とは Ember.js の run loop モジュールから切りだされたとても小さなライブラリで、短時間に集中的に発生するメソッド呼び出しの回数を制限したい場合などに利用することができます。 backburn
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
設計から実装まで、今すぐ始める高速化