HTML5 Conference 2017 http://events.html5j.org/conference/2017/9/ で使用したスライドです。本編45分。
今回はJavaScriptとWebページの表示・操作の体感速度について考えてみます。というのは,JavaScriptのせいでWebページの表示や操作などの速度が遅くなっている,と感じることがあるからです。 現在のWebサイトでは,JavaScriptを使って使い勝手を向上することは,ごく当たり前に行われています。例えば,動的にページを書き換えたり,ページ遷移を行わずにサーバーと通信を行ってデータを取得したりと,JavaScriptを使うことで,Webサイトをより便利に,より使いやすくすることができます。 Ajaxという言葉がはやってから,もう2年以上がたつんですよね。何年か前,JavaScriptはじゃまで,セキュリティを低下させる不要なものだと見なされていた頃がありました。しかしそれから一変して,「JavaScriptをがんがん使ってもいい」という空気になったことで,Webサイトを作成す
Webページの表示パフォーマンスの向上は、Webデベロッパやフロントエンドプログラマにとって永遠の課題だ。ページの表示が速いかどうかは、ユーザの満足度に大きく影響する。リッチなUIや機能を実現しつつも、ページの表示は軽くしたい。 そこで重要になってくるのが、ページの読み込み速度を測定して分析してくれるツールの存在だ。Webページパフォーマンス計測ツールを使うことで定量的に状況を把握し、改善策を練ることができるというわけだ。Webページパフォーマンス計測ツールはいくつかあるが、最も導入が簡単で、かつ効果の高いもののひとつがYahoo! Developer Networkを通じて提供されているYSlowだ。執筆現在での最新版は0.9.2となっている。 YSlowはFirebugを活用しつつJavaScriptで開発されたWebページパフォーマンス計測ツール。Yahoo! Exceptional
はじめに 「新はてなブックマーク」になったということで、とっても便利になったのですが、ブックマーク一覧ページ*1が若干 JavaScript に時間が掛かっているみたいです。 というわけで 調査してみたいと思います。調査して、改善できそうなところは後で纏めて「はてなアイデア」にでも登録しようと思います。 この日記は調査しながら、過程を書いていくつもりです。 準備 まずは、人のサイトの JavaScript を書き換えて試してみるための環境を作ります。 作業用ディレクトリを作る とりあえず、ホームに HatenaJS というディレクトリを作ります。 $ mkdir HatenaJS $ cd HatenaJS CocProxy をダウンロードしてくる 以下から CocProxy というツールをダウンロードしてきます。 http://coderepos.org/share/wiki/CocPr
前回書いた「Javascriptによる大規模開発の覚え書き」が凄いことになってました。 今回は、省略した「5.高速化せよ」について書きます。 僕にとってjavascriptは非常に高速な言語です。それは何が高速か 開発速度が高速である 開発速度、及びそこに至るまでの修得速度はとても高速です。動的言語を上手く操る開発者はもちろん、開発に不慣れな(言葉が悪いけど)新人達でさえ「動く」モノをサクっと作ってしまえる。 また、プラットフォーム(? というかブラウザ)が広く普及しているので、ググればスグに問題解決もできる。 それにローカルで簡単に作れる。javascript、それは動作環境を含めて高速です。 高速にUI操作ができる(UI操作が非常に簡単である) swingとかでUI操作をするには多くのオブジェクト操作をしなければならないけど、javascript(もといDHTML)は非常に簡単に
EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く