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
ウェブサイトをもっと速く!
Search
Takayuki Miyauchi
April 15, 2018
Technology
7
650
ウェブサイトをもっと速く!
2018年4月に和歌山のITコミュニティWackerで発表した資料です。
Takayuki Miyauchi
April 15, 2018
Tweet
Share
More Decks by Takayuki Miyauchi
See All by Takayuki Miyauchi
Geolonia のデータ連携基盤とスマートシティ構想
miya0001
1
220
データ連携基盤としてのベクトルタイル
miya0001
1
230
不動産に関連しそうなデータもろもろ
miya0001
0
88
Geolonia Maps for SmartCity
miya0001
0
790
ベクトルタイルで見えてきたデジタル地図の未来
miya0001
0
290
不動産IDの仕組みと今後の課題
miya0001
0
320
オープンソースでつくるオープンソースっぽい地図の会社の挑戦
miya0001
0
290
ITエンジニアのための住所システムのお話
miya0001
0
210
TileCloudの裏側
miya0001
0
400
Other Decks in Technology
See All in Technology
S3アクセス制御の設計ポイント
tommy0124
3
190
機械学習を扱うプラットフォーム開発と運用事例
lycorptech_jp
PRO
0
230
LLMを搭載したプロダクトの品質保証の模索と学び
qa
0
1k
AWSで推進するデータマネジメント
kawanago
1
1.3k
Skrub: machine-learning with dataframes
gaelvaroquaux
0
120
roppongirb_20250911
igaiga
1
210
Evolución del razonamiento matemático de GPT-4.1 a GPT-5 - Data Aventura Summit 2025 & VSCode DevDays
lauchacarro
0
160
250905 大吉祥寺.pm 2025 前夜祭 「プログラミングに出会って20年、『今』が1番楽しい」
msykd
PRO
1
690
20250903_1つのAWSアカウントに複数システムがある環境におけるアクセス制御をABACで実現.pdf
yhana
3
540
開発者を支える Internal Developer Portal のイマとコレカラ / To-day and To-morrow of Internal Developer Portals: Supporting Developers
aoto
PRO
1
440
AI開発ツールCreateがAnythingになったよ
tendasato
0
120
Language Update: Java
skrb
2
290
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
26
1.9k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
We Have a Design System, Now What?
morganepeng
53
7.8k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.1k
The Cult of Friendly URLs
andyhume
79
6.6k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
61k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
520
It's Worth the Effort
3n
187
28k
Music & Morning Musume
bryan
46
6.8k
Transcript
ΣϒαΠτΛ ͬͱ͘ʂ 8BDLFS ٶོߦ !NJZB
w גࣜձࣾλϩεΧΠ w Ұൠࣾஂ๏ਓ͡Ί·ͨ͠ʂ w 8PSE1SFTTͷਓɻ81$-*ίϛολʔͳͲͳͲɻ w དྷिຊ͞Μ͠·͢ɻ(PPHMF$MPVE 8PSE1SFTTͷղઆॻ Λߴڮจथ͞Μͱॻ͖·ͨ͠ʂ
ΞδΣϯμ
w ͍ͷਖ਼ٛ w ͍ͬͯͳʹʁ w ϒϥβ͕ϖʔδΛදࣔ͢Δ·ͰͷྲྀΕ w )551 w 3FTPVSDF)JOUT
w ΫϦςΟΧϧ$44 w 8PSE1SFTTͰͷߴԽ
͍ͷਖ਼ٛ
IUUQTXXXUIJOLXJUIHPPHMFDPNNBSLFUJOHSFTPVSDFTEBUBNFBTVSFNFOU NPCJMFQBHFTQFFEOFXJOEVTUSZCFODINBSLT
None
None
None
w ݸਓͷϒϩάʢIUUQTNJZBJPʣͰඵ͔Βඵʹॖ·ͬͨ݁Ռ17͕૿͑ͨʂ w ͜ΕʹऔΓΉաఔͷதͰ̓ͭ΄Ͳ8PSE1SFTTϓϥάΠϯΛ࡞Γͨ͠Γ৽نʹ࡞ͬͨΓ ͨ͠ɻ w ద༻ͨ͠΄΅ͯ͢ͷαΠτͰ্ͷΑ͏ʹ17͕૿Ճͨ͠ɻ
͍ͦͦͬͯԿʁ
ڑϥϯφʔͱͯ͠ͷ͞ͱ ڑϥϯφʔͱͯ͠ͷ͞ผ
ͨ͘͞ΜͷτϥϑΟοΫʹରͯ͠ ͘Ԡ͍ͤͨ͞ w /HJOY"QBDIFɺ.Z42-ͷνϡʔχϯά w εέʔϧΞτεέʔϧΞοϓ w αʔόʔαΠυΩϟογϡ w ΦϒδΣΫτΩϟογϡ
w ΞϓϦέʔγϣϯͷ࠷దԽ
ମײΛ͍ͨ͘͠ w $44+4ɺը૾ͷαΠζͷ࠷దԽ w )551 w 3FTPVSDF)JOU w ΫϥΠΞϯταΠυΩϟογϡ w
ඇಉظ w ଞʹࢁ΄Ͳʂ
ϒϥβ͕ϖʔδΛ දࣔ͢Δ·ͰͷྲྀΕ
໊લղܾ ଓ αʔόʔαΠυͷΞϓϦέʔγϣϯ͕ൃՐ ϒϥβ͕ίϯςϯπΛμϯϩʔυ ϨϯμϦϯά
্ͷͯ͢ͷϙΠϯτͰߴԽ͕Մೳ
IUUQTXXXIUNMSPDLTDPNKBUVUPSJBMTJOUFSOBMTIPXCSPXTFSTXPSL
UFMOFUͰ)551ͯ͠ΈΔͱ ۩ମతʹΠϝʔδ͍͔͢͠ $ telnet example.com 80 GET / HTTP/1.1 Host:
example.com
)551
)551 )551
w )551Ͱϒϥβ֤ϦιʔεΛ࠷େͰ̒ͭʢʁʣ ·Ͱ͔͠ಉ࣌ʹμϯϩʔυ͠ͳ͍ɻ w ͦͷͨΊʹੲ$44εϓϥΠτͱ͔υϝΠϯγϟʔσΟ ϯάͱ͔͍Ζ͍Ζؤுͬͨʂ w )551Ͱɺͻͱͭͷ5$1ଓͰ·ͱΊͯμϯϩʔ υͰ͖Δɻ
)5514FSWFS1VTI
w ͋ͱ͔Β༻͢Δ͜ͱ͕Θ͔ͬͯΔ$44+4ɺը૾ͳͲ Λϒϥβ͔ΒͷϦΫΤετΛͨͣʹ1VTIɻ
8PSE1SFTTϓϥάΠϯΛ࡞ͬͯΈͨ
w ϒϥβʹΩϟογϡ͕͋ͬͯ1VTIͯ͠͠·͏ͷͰɺͳΜ Ͱ͔ΜͰ1VTIͯ͠͠·͏ͷɺ͍·͍ͪͳ͜ͱ͕Θ͔ͬ ͨɻ8PSE1SFTTϓϥάΠϯͱͯ͠͏গ͠ݕ౼͕ඞཁɻ w ଚܟ͢Δ8PSE1SFTTͷίϛολʔͷҰਓɺ"BSPO+PSCJO͕ ৯͍͍ͭͯ͘Εͨͷ͕خ͔ͬͨ͠ɻʢҧ
3FTPVSDF)JOUT
w %/41SFGFUDI w 1SFDPOOFDU w 1SFGFUDI w 1SFSFOEFS IUUQTXDHJUIVCJPSFTPVSDFIJOUT
<link rel=“prerender" href="//example.com/next-page.html"> ͨͩ͠1SFSFOEFSϖʔδʹ͖͔ͭͭ͑͠ͳ͍ʜɻ 3FTPVSDF)JOUTɺMJOLͰຒΊࠐΉ͚ͩͳͷͰ ׂͱ؆୯ʹಋೖՄೳ
8PSE1SFTTͰ ҎԼͷΑ͏ͳײ͡Ͱ࣮Մೳ function makewp_example_resource_hints( $hints, $relation_type ) { if (
'dns-prefetch' === $relation_type ) { $hints[] = '//make.wordpress.org'; } else if ( 'prerender' === $relation_type ) { $hints[] = 'https://make.wordpress.org/great-again'; } return $hints; } add_filter( 'wp_resource_hints', 'makewp_example_resource_hints', 10, 2 );
ΫϦςΟΧϧ$44
<?php sleep( 10 ); // すげー重たいCSS header( 'Content-Type: text/css; charset=UTF-8'
); ?> h1 { color: #ff0000; } ͜ΕΛϒϥβͰಡΈࠐΜͩΒͲ͏ͳΔ͔ࢼͯ͠ΈΑ͏ʂ
ϑΝʔετϏϡʔͰදࣔ͞Εͯͳ͍ͱ͜Ζ͕͍ͬͺ͍͋Δɻ ϝσΟΞΫΤϦʔΛۦͯ͠ϑΝʔετϏϡʔͰ ෆཁͳ$44+4ʹΑΔϨϯμϦϯάϒϩοΫΛ͙ɻ
IUUQTEFWFMPQFSTHPPHMFDPNXFCGVOEBNFOUBMTQFSGPSNBODFDSJUJDBM SFOEFSJOHQBUISFOEFSCMPDLJOHDTT IMKB
8PSE1SFTTͷߴԽ
8PSE1SFTTॏ͍ʁ w 8PSE1SFTT͕ॏ͍ͱ͍͏ΑΓɺ؆୯ʹॏ͘Ͱ͖Δͱ͍ ͏ͷ͕ਖ਼͍͠ɻ
ॏ͘ͳΓ͕ͪͳϙΠϯτ
ϓϥάΠϯଟ͗͢ w ϓϥάΠϯͷઃఆ߲ϩʔυ࣌ʹͯ͢·ͱΊͯಡΈࠐ ·ΕΔɻϓϥάΠϯΛΞϯΠϯετʔϧͨ͠ޙͦΕΒ ΔͷͰຊ൪ڥͰϓϥάΠϯΛ͋Ε͜Εࢼ͚ͩ͢Ͱύ ϑΥʔϚϯεԼͷݪҼʹͳΓ͏Δɻ w γϣʔτίʔυͳͲͷϓϥάΠϯɺͦͷγϣʔτίʔυ Λ༻͍ͯ͠ͳ͍ϖʔδͰ$44ΛಡΈࠐΉɻͦͷγϣʔ τίʔυ΄ΜͱʹͬͯΔʁ
ΩϟογϡܥϓϥάΠϯΛ ৴༻͗͢͠ w ΩϟογϡܥϓϥάΠϯॏ͍αΠτΛͪΐͬͱϚγ ʹͯ͘͠ΕΔͬͯఔͷظͰɻ w ڞ༗αʔόʔͰٯޮՌʹͳΔ͜ͱ͕ଟ͍ɻʢԤถͷڞ༗ αʔόʔͰར༻ېࢭʹͳ͍ͬͯΔ͜ͱ͕΄ͱΜͲɻʣ w ͍͜ͳͨ͢Ίʹߴͳ͕ࣝඞཁɻ
ॏ͘ͳΔϓϥάΠϯͷύλʔϯ w ؔ࿈هࣄܥ w ϦϯΫνΣοΫͯ͘͠ΕΔܥ ͋ͱ+FU1BDLʜ
͘͢ΔͨΊͷϙΠϯτ
w 1)18PSE1SFTT1)1Ҏ্Λਪʂ w /HJOYγϯάϧϓϩηεɺΠϕϯτۦಈɺඇಉظʂ w ը૾ͷ࠷దԽKQFHPQUJN QOHRVBOUͳͲͳͲɻ w +4ɺ$44ͷ࠷దԽɻಡΈࠐΈλΠϛϯάͷมߋɻ ҎԼͷ߲͚ͩͰ͔ͳΓҧ͏ʂ
1)1ͷར༻͕͍ͷͰڞ༗αʔόʔͷਓ͍·͙͢ίϯτϩʔϧύωϧʂ
IUUQTNJZBJPPQUJNJ[FJNBHFTGPSXPSEQSFTTXJUIUIF KQFHPQUJN 8PSE1SFTTͰͷKQFHPQUJNʹΑΔ ը૾ͷ࠷దԽͷ࣮ྫ ίΞίϛολʔʹ ๙ΊΒΕͨʂ
8PSE1SFTTͰ$44ͷಡΈࠐΈλΠϛϯάΛมߋ͢Δ+4ͷྫ ͻͱͭͻͱͭಓʹؤுͬͨΒɺ ͔ͨ͠ʹτοϓϖʔδͰ.#Ҏ্ͷαΠζݮʹޭͨ͠ɻ ʢASFMTVCSFTPVSDFAͷ΄͏͕͍͍͔ʣ
ͦͷଞ w 8PSE1SFTTͷ৽ΤσΟλʔɺ(VUFOCFSH͕ಋೖ͞ΕΔͱαʔυ ύʔςΟͷϓϥάΠϯʹΑͬͯେྔͷ$44+4͕ϩʔυ͞ΕΔ Մೳੑ͕͋ΔɻϑϩϯτΤϯυʹؔ͢ΔεΩϧͷཁٻਫ४্͕ ͕ͬͯ͠·͏͔ɻ w 8PSE1SFTTͷK2VFSZͱKRVFSZNJHSBUFIFBEͰಡΈ ࠐ·ΕͯϨϯμϦϯάΛϒϩοΫ͢ΔͷͰཁҙɻ
5IBOLT ͓ࣄͷ૬ஊҎԼ·Ͱɻ IUUQTUBSPTLZDPKQ IUUQTMJDUKQ