タグ

Performanceとjqueryに関するm_shige1979のブックマーク (4)

  • フロントエンドで知っておきたい要素指定の考え方 - pixiv inside [archive]

    みなさんはじめまして、ピクシブのフロントエンドエンジニア id:koharusugiura です。 JavaScript を用いた開発を行う際に jQuery や Reactvue.js といったライブラリーを使う方は多いでしょう。これらのライブラリーは共通して DOM を扱うライブラリーとなります。 DOM についての説明は長くなるのでここでは省きますが、簡単に説明すると HTML や XML の構造を表現するための仕様です。DOM は JavaScript のためだけにある仕様ではなく、 JavaPython など、多くの言語に対応する仕様です。 前述した各ライブラリーは多くのウェブブラウザー間の差異を吸収してくれるため、非常に便利なものです。しかし、その機能の豊富さからライブラリー自体のサイズは大きく、ウェブブラウザーで読み込むファイルの数や合計の容量が増えてしまいます。状況

    フロントエンドで知っておきたい要素指定の考え方 - pixiv inside [archive]
  • jQueryのclassセレクタに要素名を付ける

    そして結論として以下のように書いております。 このようにIE8やGoogle Chromeなどでは数ミリ秒遅くなってしまうがIE6やIE7に対応する場合にはclass属性への要素の付加は必須のパフォーマンス対策である。 つまり、「jQueryのclassセレクタに要素名を付ける」というはIE6やIE7でjQueryのセレクタを高速化するテクニックとして紹介しています。が発売された当時はIE8が最新ブラウザでIE6やIE7が必須という案件は非常に多かった時代なのでしかたなかったわけです。 とうぜんコメント欄で指摘されているようにIE9以降ではgetElementsByClassNameが採用される「要素名を付けない」パターンのほうが高速化されますし、書籍に書いてあるとおりquerySelectorAllが採用されるIE8においても「要素名を付けない」パターンのほうが高速化されます。 「Ja

    jQueryのclassセレクタに要素名を付ける
  • そのコード、本当にjQueryが必要ですか?ネイティブ関数の代替Tips集 | ゆっくりと…

    sitepoint から「当にjQueryが必要ですか?」とタイトルのついた3の記事を紹介します。 Do You Really Need jQuery? Native JavaScript Equivalents of jQuery Methods: the DOM and Forms Native JavaScript Equivalents of jQuery Methods: Events, Ajax and Utilities 言うまでもなく著者の Craig Buckler さん の趣旨は、「jQueryを使うのは止めよう」ではありません。ネイティブ関数で代替えできるのは、古い IE のサポートが必要なく、ごく簡単なケースに限られます。その代わりに得るものは「速さ」です。そこで、どの程度「速い」のかを所々 jsperf の結果で補ってみたいと思います。 また JavaScri

  • とあるサイトの高速化についてフロントエンドでやったことまとめ。 - Toro_Unit

    業務で携わっている案件なのですが、アクセス数の急増が見込まれるイベントがありまして。準備期間も少なく、バックエンド側でできることがほぼないという状況でサイトを落とさないようにがんばる!というお仕事でした。レガシーソースてんこ盛り。CSSプリプロセッサとか何それ状態。 そこで実施した対策のまとめです。サーバー・アプリケーション・サイトの構成によって、効果の大小はありますが、比較的効果があったと思われるものをつらつらと。 リクエストの削減とファイルサイズの最適化 まず一番最初に考えなければいけないのがリクエスト数です。すごいおおざっぱに言うと、WEBサーバー(ApacheとかNginxとか)への負荷は、PV数×リクエスト数です。PVがそんなに無くてもそのページのリクエストがめちゃくちゃ多いとそれだけでかなりの負荷になります。リクエストを半分にできれば2倍の人数がさばけるってことに、すげーおおざ

    とあるサイトの高速化についてフロントエンドでやったことまとめ。 - Toro_Unit
  • 1