Skip to content

Vol.295

Site-Speed Topography – CSS Wizardry – Web Performance Optimisation #

Web サイトパフォーマンスを WebPageTest を使って改善する #

Harry 氏が実際にどのように Web サイトパフォーマンスを改善しているか、その方法を紹介する。Google Analytics では平均ページ読み込み時間が解析できるが、これは特定のページがどのようなパフォーマンスがでているかは確認できるが、サイト全体の状態を確認するためのデータとするには使いにくい。氏曰く、まず Web サイトをページタイプごとに分類し、WebPageTest データを集め、そこからビジュアライズをしていくようにすることで、本当の問題点が見えるようにしていくようなやり方を紹介している。

Web Platform Design Principles #

Web プラットフォームにおける設計の原則 #

W3C が公開している、Web プラットフォームテクノロジを設計するときに気をつけておきたい設計原則。Web サイトの仕様設計者はこのドキュメントを参考にして設計を進めることを勧めている。

  1. WebAPI の設計原則
  2. 言語を超えた API 設計
  3. CSS
  4. JavaScript

など

The Raven Technique: One Step Closer to Container Queries | CSS-Tricks #

CSS 関数を駆使したコンテナクエリライクな実装 #

CSS のminmaxclampなどの関数や CSS 変数を組み合わせることで、コンテナクエリのような動作を実現するための実装アイディアを紹介する。

JavaScript’s Memory Management Explained #

ほとんどの場合、JavaScript 開発者はメモリ管理について何も知らなくても問題が発生することはない。しかしながら、ある時点でメモリリークなどの問題が発生した場合、これについて知っておくことを解決をすることができる。この記事では、JavaScript のメモリ割り当てとガベージコレクションがどのように機能するかを紹介し、一般的なメモリリークを回避する方法を紹介する。

Effective Skeleton Screens - Web Performance Consulting | TimKadlec.com #

読み込み時間にスピナーやプログレスバーではなく、スケルトンを表示することで、コンテンツのアウトラインを伝えることができるメリットがある。しかしながら、誤った使い方をすることで、UX を損なってしまうこともある。この記事では、スケルトンの適切な使い方を解説する。

In Brief #