Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

loading=lazy

Avatar for Kaneko Takeshi Kaneko Takeshi
February 28, 2020
Technology
31
0

 loading=lazy

pizza_jp#26

Avatar for Kaneko Takeshi

Kaneko Takeshi

February 28, 2020

More Decks by Kaneko Takeshi

See All by Kaneko Takeshi
オープンソースライセンスについて勉強する定期
Avatar for Kaneko Takeshi tkckaneko
0
46
Eye Tracking on the Browser
Avatar for Kaneko Takeshi tkckaneko
0
99
IEEE754を完全に理解した
Avatar for Kaneko Takeshi tkckaneko
1
87
CSSのトレンドをみんなで見よう -2021年-
Avatar for Kaneko Takeshi tkckaneko
0
100
多分これが一番早いと思います
Avatar for Kaneko Takeshi tkckaneko
0
31
暗黒面の話
Avatar for Kaneko Takeshi tkckaneko
0
31
CSR / SSR / SSG / JAMstack
Avatar for Kaneko Takeshi tkckaneko
0
79
BOLT
Avatar for Kaneko Takeshi tkckaneko
0
41
CSS Logical Properties and Values
Avatar for Kaneko Takeshi tkckaneko
0
60

Other Decks in Technology

See All in Technology
例外の正しい扱い方 そのエラー try-catchして大丈夫？
Avatar for Watanabe Jin jinwatanabe
3
490
生成AIエージェントを用いた、 手動テスト手順書から自動テストへの 変換手法の検討
Avatar for MagicPod magicpod
0
130
Claude Codeを「使うほど育つ」AI秘書にするノウハウ
Avatar for みのるん minorun365
PRO
6
2.2k
データ界隈LT祭 第1回LT登壇
Avatar for タロウ taromatsui_cccmkhd
1
1.2k
AIを活用するために決めた "やらないこと" - 価値に注目する / Not betting on AI
Avatar for soudai sone soudai
PRO
1
490
フルカイテン株式会社 エンジニア向け採用資料
Avatar for FULL KAITEN fullkaiten
0
12k
Claude in Chrome 入門 / Introduction to Claude in Chrome
Avatar for yuta cielo1985
0
720
絵ではじめるKubernetesセキュリティ
Avatar for Aoi Takahashi aoi1
3
430
Claude Code本って、 読む必要あるの？
Avatar for Oikon oikon48
2
440
ASTを使って影響範囲を特定する
Avatar for Nealle nealle
0
190
技術的負債から考える、AI時代のエンジニアリング投資 — ビズリーチの技術的負債と向き合った経験から、変更し続けられるソフトウェアを考える/ technical-debt-con2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
860
20260912_スクフェス三河
Avatar for hikari kgnkhkr
0
350

Featured

See All Featured
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.6k
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
63
46k
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
3
560
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.2k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
Avatar for Andy Polaine apolaine
2
430
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
9
990
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
19k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
408
67k
Stewardship and Sustainability of Urban and Community Forests
Avatar for Eric Wiseman pwiseman
0
520
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
530
Public Speaking Without Barfing On Your Shoes - THAT 2023
Avatar for David Neal reverentgeek
1
560

Transcript

  1. loading=lazy

  2. - 2月12日にHTML Living Standardが更新され<img>と<iframe>に loadingプロパティが公式に追加されました。 - 「公式に」というのは既に去年の6月4日リリースのChrome75で は実装されていたので - 公式に発表されたことでFirebaseの75でもサポートされるようにな

    るそうです - Chromiumを使っているMicrosoft Edgeも実装済みです
  3. None

  4. - loading=lazyは読み込みを遅延するためのプロパティです - 画像がブラウザの表示領域に入ると読み込まれます - 指定をしないとloading=autoと同じになります - ブラウザの指定に従います - 今まで通りに読み込ませたいときにはloading=eagerを指定しま

    す

  5. - ちなみにサポートしていないブラウザでも動作させるためにpolyfilもあ るので、既に導入しても大丈夫です - どうでもいい情報ですが、wordpressに対応させるためのプラグインも あるそうです（Google製）

  6. None

  7. 参考 - https://html.spec.whatwg.org/multipage/urls-and-fetching.html#laz y-loading-attribute - https://github.com/mfranzke/loading-attribute-polyfill - https://ja.wordpress.org/plugins/native-lazyload/ - https://scalable-loading-contribs.firebaseapp.com/test.html