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
Shifterだからできる!ページ遷移のスピードを神速化する方法
Search
Daisuke Kawabata
February 06, 2019
Programming
0
1.5k
Shifterだからできる! ページ遷移のスピードを 神速化 する方法
Daisuke Kawabata
February 06, 2019
Tweet
Share
More Decks by Daisuke Kawabata
See All by Daisuke Kawabata
WordPress管理画面にマグネットコーティングを施して快速にするテクニック
kwbtdisk
0
600
WordCamp Tokyo 2018 Session あなたも明日からできる!グローバルチームを組成して一緒に働くチャレンジ
kwbtdisk
1
150
WordPress海外マーケット(Theme / Pluginの販売事業者)売上・ビジネスモデル徹底解剖 @ WordBench東京 12月勉強会 年末LT忘年会
kwbtdisk
0
250
Other Decks in Programming
See All in Programming
技術同人誌をMCP Serverにしてみた
74th
0
150
VS Code Update for GitHub Copilot
74th
1
150
ktr0731/go-mcpでMCPサーバー作ってみた
takak2166
0
170
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
knakagawa
1
120
LINEヤフー データグループ紹介
lycorp_recruit_jp
0
770
Beyond Portability: Live Migration for Evolving WebAssembly Workloads
chikuwait
0
390
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
3
830
C++20 射影変換
faithandbrave
0
500
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
290
Elixir で IoT 開発、 Nerves なら簡単にできる!?
pojiro
1
150
Using AI Tools Around Software Development
inouehi
0
1.2k
都市をデータで見るってこういうこと PLATEAU属性情報入門
nokonoko1203
1
550
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Why You Should Never Use an ORM
jnunemaker
PRO
56
9.4k
Rails Girls Zürich Keynote
gr2m
94
14k
For a Future-Friendly Web
brad_frost
179
9.8k
Making the Leap to Tech Lead
cromwellryan
134
9.3k
Product Roadmaps are Hard
iamctodd
PRO
53
11k
Building an army of robots
kneath
306
45k
YesSQL, Process and Tooling at Scale
rocio
173
14k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Optimizing for Happiness
mojombo
379
70k
4 Signs Your Business is Dying
shpigford
184
22k
Transcript
Shifter$ # " 2019/02/06 Shiftup! JP_Getshifter
Vol1 LT STOVE !
Shifter 4 3. -2 &) (!) Service Worker"1'*+%
(,Shifter$0//! (#!!)
>BJWordPressDW S6/R< '. "&, ReadyShip ?V/ https://readyship.co/ja/
+.%+&)-:M4 &* " $.(! 9IU7T / 1987@L05 K / FA3O STOVE 2Q / =C SI P ;G (3@) → $+.*--#( 1.5@) → H18 4EN X
AFNWordPressH[ W9/V? (/!#'- ReadyShip BZ0 https://readyship.co/ja/ ,
/&,'*.=Q7 '+!# %/)" <MY:X / 1987DP18 O / JE5S STOVE 4U / @G SI T >K (3D) → %,/+..$( 1.5D) → L2; 4IR \ Ready-Made WordPress 6YC (3D- )
None
None
WordPress 5
None
None
None
dev.to ""
Shifter + Prefetch + Service Worker (!) Shifter
= EC
: CloudFront ) CloudFront"# ".+"
&, !%(HTML)$%*-40 - 60ms ((' 30ms)
CloudFront
CloudFront
CloudFront
/5+# - Prefetch + Service Worker )3!" '2 1, /5
*6 &%& . 70 &Prefetch $!" (Service Worker) &70- Service Worker!" 4 => 10ms('
/5+# - Prefetch + Service Worker )3!" '2 1, /5
*6 &%& . 70 &Prefetch $!" (Service Worker) &70- Service Worker!" 4 => 10ms('
/5+# - Prefetch + Service Worker )3!" '2 1, /5
*6 &%& . 70 &Prefetch $!" (Service Worker) &70- Service Worker!" 4 => 10ms(' 8ms!!
&)!'$"( > Service Worker- 50/2+3 ,4'$"(9* #%
:0/ Prefetch* #%&)!'$"( 0/16=;.< 87
Shifter'-4 1" &% Prefetch( ! 20,
1PV PHP0,$+ 10# Shifter3 (/. *)'-)
Shifter/5< !#"9(,+ Prefetch0'$:84 1PV PHP84*310)
Shifter; ( 76 %" &21/5) Shifter -.
IntersectionObservera IntersectionObserver Service Worker