タグ

performanceに関するamada717のブックマーク (2)

  • Webパフォーマンス虎の巻

    Webパフォーマンス向上施策のために、今更ながら超速1を読んだので、今までの自分の知見と合わせてまとめてみます。 なるべく柔らかく、改善施策ってまず何をどうすればいいの?という疑問を持った人に向けて書いています。 ▪️格言 そもそもWebは速い。遅くしているのは我々です。大抵は技術の問題ではなくて、人の問題。 引用元: テクニックではなく、今、気で取り組むべきWebパフォーマンス (html5jパフォーマンス部 部長 竹洞さん) 心得 パフォーマンス向上に対する施策は大別すると以下の2通り 軽量化 (単純にやりとりするデータ容量を小さくすること) 圧縮 削除 最適化 (その時に最も適している実装・実行をとること) 経路・順番の変更 非同期 もっとも遅くしている原因を探して、それを対策するのが原則。「対効果」が絶対的正義である。手段から入るのは愚策。まず先に原因を知ることが重要。 ▪️1

    Webパフォーマンス虎の巻
  • 身につけておきたいWebサイト高速化テクニック #6|HTTPリクエスト数削減テクニック02:CSS Sprite編 | DevelopersIO

    はじめに 前回はHTTPリクエスト数削減テクニック01「インラインイメージ編」でData URI Encodeを使ったインラインイメージについて紹介しました。この記事をより深く解説した記事をCodezineさまに寄稿したのでこちらも参考にしてください。 今回はHTTPリクエスト数削減テクニックの2つ目「CSS Sprite」について解説します。 すでに定番のテクニックとなっていますが何となく使っていることが多いと思うので復習と思って読んでみてはいかがでしょうか。これから覚える方にも向けて丁寧に解説したいと思います。 1,CSS Spriteとは CSS Spriteとは、アイコンやナビゲーションなどのいくつかの画像を1つにまとめた画像(以降Sprite画像とする)を用意し、CSSのbackgroundプロパティを使って一部分のイメージだけを見せるテクニックです。代表的なSprite画像の例

    身につけておきたいWebサイト高速化テクニック #6|HTTPリクエスト数削減テクニック02:CSS Sprite編 | DevelopersIO
  • 1