タグ

ブックマーク / blog.jxck.io (2)

  • Private Class Field の導入に伴う JS の構文拡張 | blog.jxck.io

    Intro ECMAScript の Private Class Field の仕様策定と各ブラウザの実装が進んでいる。 これにより、従来の JS にはなかった Class の Private フィールドが使えるようになる。 提案されている構文や、挙動について解説する。 Class Field Declaration まず前提として、現状の Class の フィールドはコンストラクタで定義する必要がある。 例えば count フィールドを持つ Counter クラスを定義した場合、以下のようになる。 class Counter { constructor() { this.count = 0 } increment() { this.count ++ } display() { console.log(this.count) } } const c = new Counter() c.in

    Private Class Field の導入に伴う JS の構文拡張 | blog.jxck.io
  • Intersection Observer を用いた要素出現検出の最適化 | blog.jxck.io

    Intro スクロールによる DOM 要素の出現などを効率よく検知するため、新しく Intersection Observer という API が追加された。 この API の使い方と、サイトへの適用について記す。 要素交差(intersection)の検出 ページをスクロールしていく過程で、特定の DOM が画面に出現したことをフックしたいケースがある。 代表例は 画像の遅延読み込み であり、初期ロードでは画像の取得を行わずスクロールしていく過程で順次取得する手法である。 特に画像の多いページでは表示に必要なリソース取得のみに最適化でき、初期画面表示などでは効果が大きいとされる。 これを実装するのに必要なのは、「 <img> 要素が出現しているかどうか」であるが、質的には「画面外にあった <img> が viewport と交差したか」を取得することになる。 つまり、 要素出現の取得

    Intersection Observer を用いた要素出現検出の最適化 | blog.jxck.io
  • 1