タグ

performanceに関するhashimoyaのブックマーク (6)

  • ローカルストレージに簡単な解決策はない

    原文:“There is no simple solution for local storage” (on March 5, 2012 by Chris Heilmann) 要約:私たちは良いデータストアとして localStorage を推奨するのをやめなければならない。パフォーマンスがひどく損なわれるからだ。しかし残念なことに、代わりとなるものはまだ完全にサポートされておらず、また簡単に実装できるものでもない。 Web 開発において、うますぎる話に出くわすことは常々だ。そういったもののいくつかは良いもので、だからこそそれが「すべて」として目立ってしまい、開発者を使うように仕向けてしまう。しかし、多くの場合、良いと思われていたものはそこまで良いものではない。また、しばらく使ってみてはじめて「間違っていた」と気づかされるものなのだ。 そんなもののひとつに、localStorage がある

    ローカルストレージに簡単な解決策はない
  • jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ

    JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを5つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){

    hashimoya
    hashimoya 2012/01/24
    近くにししょーがいないとこういうノウハウが継承されないんだよなー。ありがたし
  • High-Performance Javascript

    book by Nicholas C. Zakas presentation by Goran Topic Loading and Execution or how not to block your page The first job: getting your scripts to run Standard way: list them in <head/> That way, we know they are available "Standard" way <html> <head> <title>Test</title> <script type="text/javascript" src="file1.js"></script> <script type="text/javascript" src="file2.js"></script> <script type="text

  • HTML5, CSS3, and DOM Performance

    Paul Irish, from the Chrome Developer Relations team, walks through smart techniques to improve the performance of your app. He describes CSS reflows and how to avoid them, hardware accelerated CSS, animation optimization, web workers, benchmarking and build scripts.

    HTML5, CSS3, and DOM Performance
  • High Performance Web Design ~デザインから考えるハイパフォーマンスWebサイト~ | warikiru

    2009-11-24 High Performance Web Design ~デザインから考えるハイパフォーマンスWebサイト~ ラベル: performance CSS Nite in ISHIKAWAで話をしてから1ヶ月経ったので、薄れゆく記憶の復習も兼ねて思いの丈を綴ってみたw High Performance Web Design 1. What's High Performance?ここでいうパフォーマンスというのはWebサイトの表示高速化についてです。つまり、ページをいかに早く表示させるかという課題です。でも、そうゆうのってサーバー側の問題でしょ?システムエンジニアの管轄じゃないの?と思われがちですが「ハイパフォーマンスWebサイト」の著者であるSteve Soudersの調査によると、80:20。一般的にユーザーの待ち時間の実に80%がブラウザ側、フロントエンドで費やされて

  • 軽量化を制するものはサイトを制す!! | _level0 - KAYAC Front Engineer Blog

    遅かれ今年初エントリーなので、改めまして明けましておめでとうございます! 今回はデータの軽量化についての策を出していこうと思います。 アニメーションベースのサイトを制作すると、いつも頭を悩ますのが”重さ”です。 せっかくアニメを作って組み上げたはいいもの、サーバに上げてみると重くて観れたものじゃないってことがあります。 その原因は大きく分けて3つ… 【素材】 ①サイズの大きいビットマップ ②アンカーポイントの多いベクターデータ ③アウトラインが線 ④シンボルに変換せず素材を使用 【タイムライン】 ①モーショントゥイーンを同じ時系列で複数配置 ②フェイドイン・アウト ③キーフレーム 【フィルターの使用】 ①ぼかし・ドロップシャドウなど そしてこれらの問題を改善する方法とは… 【素材】 ① ・画質を若干落とし、劣化した場合にはスムージングで対処 (ビットマッププロパティで設定) ・GIF画像に

    軽量化を制するものはサイトを制す!! | _level0 - KAYAC Front Engineer Blog
  • 1