Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
loading=lazy
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Kaneko Takeshi
February 28, 2020
Technology
22
0
Share
loading=lazy
pizza_jp#26
Kaneko Takeshi
February 28, 2020
More Decks by Kaneko Takeshi
See All by Kaneko Takeshi
オープンソースライセンスについて勉強する定期
tkckaneko
0
35
Eye Tracking on the Browser
tkckaneko
0
91
IEEE754を完全に理解した
tkckaneko
1
79
CSSのトレンドをみんなで見よう -2021年-
tkckaneko
0
97
多分これが一番早いと思います
tkckaneko
0
28
暗黒面の話
tkckaneko
0
27
CSR / SSR / SSG / JAMstack
tkckaneko
0
74
BOLT
tkckaneko
0
33
CSS Logical Properties and Values
tkckaneko
0
39
Other Decks in Technology
See All in Technology
Kubernetes基盤における開発者体験 とセキュリティの両⽴ / Balancing developer experience and security in a Kubernetes-based environment
chmikata
0
160
AWSで2番目にリリースされたサービスについてお話しします(諸説あります)
yama3133
0
120
AWS DevOps Agent or Kiro の使いどころを考える_20260402
masakiokuda
0
170
解剖"React Native"
hacusk
0
110
OCI技術資料 : ロード・バランサ 概要 - FLB・NLB共通
ocise
4
27k
制約を設計する - 非決定性との境界線 / Designing constraints
soudai
PRO
5
1.5k
仕様通り動くの先へ。Claude Codeで「使える」を検証する
gotalab555
5
1.8k
Network Firewall Proxyで 自前プロキシを消し去ることができるのか
gusandayo
0
190
20260326_AIDD事例紹介_ULSC.pdf
findy_eventslides
0
520
I ran an automated simulation of fake news spread using OpenClaw.
zzzzico
1
890
不確実性と戦いながら見積もりを作成するプロセス/mitsumori-process
hirodragon112
1
190
やさしいとこから始めるGitHubリポジトリのセキュリティ
tsubakimoto_s
3
2.2k
Featured
See All Featured
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
160
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
200
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
470
For a Future-Friendly Web
brad_frost
183
10k
Tell your own story through comics
letsgokoyo
1
880
Test your architecture with Archunit
thirion
1
2.2k
Writing Fast Ruby
sferik
630
63k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
55k
Documentation Writing (for coders)
carmenintech
77
5.3k
The Curse of the Amulet
leimatthew05
1
11k
The untapped power of vector embeddings
frankvandijk
2
1.7k
RailsConf 2023
tenderlove
30
1.4k
Transcript
loading=lazy
- 2月12日にHTML Living Standardが更新され<img>と<iframe>に loadingプロパティが公式に追加されました。 - 「公式に」というのは既に去年の6月4日リリースのChrome75で は実装されていたので - 公式に発表されたことでFirebaseの75でもサポートされるようにな
るそうです - Chromiumを使っているMicrosoft Edgeも実装済みです
None
- loading=lazyは読み込みを遅延するためのプロパティです - 画像がブラウザの表示領域に入ると読み込まれます - 指定をしないとloading=autoと同じになります - ブラウザの指定に従います - 今まで通りに読み込ませたいときにはloading=eagerを指定しま
す
- ちなみにサポートしていないブラウザでも動作させるためにpolyfilもあ るので、既に導入しても大丈夫です - どうでもいい情報ですが、wordpressに対応させるためのプラグインも あるそうです(Google製)
None
参考 - 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