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
620
ウェブサイトをもっと速く!
2018年4月に和歌山のITコミュニティWackerで発表した資料です。
Takayuki Miyauchi
April 15, 2018
Tweet
Share
More Decks by Takayuki Miyauchi
See All by Takayuki Miyauchi
Geolonia のデータ連携基盤とスマートシティ構想
miya0001
1
130
データ連携基盤としてのベクトルタイル
miya0001
1
200
不動産に関連しそうなデータもろもろ
miya0001
0
67
Geolonia Maps for SmartCity
miya0001
0
720
ベクトルタイルで見えてきたデジタル地図の未来
miya0001
0
270
不動産IDの仕組みと今後の課題
miya0001
0
300
オープンソースでつくるオープンソースっぽい地図の会社の挑戦
miya0001
0
260
ITエンジニアのための住所システムのお話
miya0001
0
160
TileCloudの裏側
miya0001
0
370
Other Decks in Technology
See All in Technology
設計を積み重ねてシステムを刷新する
sansantech
PRO
0
130
AWSを活用したIoTにおけるセキュリティ対策のご紹介
kwskyk
0
120
わたしのOSS活動
kazupon
2
330
OpenID BizDay#17 みんなの銀行による身元確認結果の活用 / 20250219-BizDay17-KYC-minna-no-ginko
oidfj
0
210
Cracking the Coding Interview 6th Edition
gdplabs
14
28k
Share my, our lessons from the road to re:Invent
naospon
0
120
Apache Iceberg Case Study in LY Corporation
lycorptech_jp
PRO
0
230
OpenID BizDay#17 KYC WG活動報告(法人) / 20250219-BizDay17-KYC-legalidentity
oidfj
0
450
Cloud Spanner 導入で実現した快適な開発と運用について
colopl
1
990
Raycast Favorites × Script Command で実現するお手軽情報チェック
smasato
1
120
Exadata Database Service on Cloud@Customer セキュリティ、ネットワーク、および管理について
oracle4engineer
PRO
2
1.5k
Tech Blogを書きやすい環境づくり
lycorptech_jp
PRO
1
270
Featured
See All Featured
YesSQL, Process and Tooling at Scale
rocio
172
14k
Into the Great Unknown - MozCon
thekraken
35
1.6k
Music & Morning Musume
bryan
46
6.4k
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
100
18k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Making Projects Easy
brettharned
116
6k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Build The Right Thing And Hit Your Dates
maggiecrowley
34
2.5k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Six Lessons from altMBA
skipperchong
27
3.6k
The Language of Interfaces
destraynor
156
24k
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