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
進化するAMPとはてなブログ / AMP and HatenaBlog Evolve
Search
hogashi
June 26, 2019
1
1.9k
進化するAMPとはてなブログ / AMP and HatenaBlog Evolve
Hatena Engineer Seminar #12 (2019/06/26, 2019/07/03)
hogashi
June 26, 2019
Tweet
Share
More Decks by hogashi
See All by hogashi
SLTとBBCのご紹介
hogashi
0
60
hogashi-hatena-intern-intro
hogashi
0
48
Featured
See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
7
330
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
A Tale of Four Properties
chriscoyier
160
23k
It's Worth the Effort
3n
185
28k
How STYLIGHT went responsive
nonsquared
100
5.6k
Writing Fast Ruby
sferik
628
62k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
45
7.5k
The Straight Up "How To Draw Better" Workshop
denniskardys
235
140k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Fireside Chat
paigeccino
37
3.5k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Done Done
chrislema
184
16k
Transcript
ਐԽ͢Δ".1ͱ ͯͳϒϩά JEIPHBTIJ )BUFOB&OHJOFFS4FNJOBS
גࣜձࣾͯͳ ೖࣾ ΞϓϦέʔγϣϯΤϯδχΞ ͯͳϒϩά 1FSM+BWB4DSJQU JEIPHBTIJ
JEIPHBTIJ ೖࣾ
JEIPHBTIJ ೖࣾ ৽ଔͰ͢
͢͜ͱ ".1 ͷհ ͯͳϒϩά ʹ͓͚Δ ".1 ͷհ ".1 ͷਐԽ ͯͳϒϩά
ͷਐԽ
".1 IUNM⚡ ϨϯμϦϯά͕͍
".1 ߴʹදࣔͰ͖Δ8FCϖʔδΛ ؆୯ʹͭͬͨ͘Γ͢ΔͨΊͷ Φʔϓϯιʔεͳ 8FCϑϨʔϜϫʔΫ
".1 8FCϖʔδΛߴʹදࣔ
".1 8FCϖʔδΛߴʹදࣔ ৴ ϨϯμϦϯά
ܾ·ͬͨܗͰॻ͘".1)5.- ϨϯμϦϯά
ܾ·ͬͨܗͰॻ͘".1)5.- ϥϯλΠϜΛಡΈࠐΉ".1+4 ϨϯμϦϯά
ܾ·ͬͨܗͰॻ͘".1)5.- ϥϯλΠϜΛಡΈࠐΉ".1+4 ".1+4͕".1)5.-Λ ϨϯμϦϯά ϨϯμϦϯά
ߴͳϨϯμϦϯάͷͨΊʹ੍ݶ͕͋Δ ".1)5.-
ߴͳϨϯμϦϯάͷͨΊʹ੍ݶ͕͋Δ ɾࣗ༝ͳTDSJQUॻ͚ͳ͍ ɾJNHͰͳ͘BNQJNH w XJEUI IFJHIUͷࢦఆ͕ඞਢ ".1)5.- ͳͲ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ༰Λ
".1)5.-ʹॻ͖͑Δ
৴ ".1$BDIF
༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴʹ৴ ৴ ".1$BDIF
৴ ".1$BDIF (PPHMF $MPVEqBSFͳͲ͕୲ ༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴʹ৴
ߴͳϨϯμϦϯά ߴͳίϯςϯπ৴ ".1 ⚡
".1͕Α͘ग़ͯ͘Δॴ εϚϗͰͷ(PPHMFݕࡧ݁Ռ ͯͳϒοΫϚʔΫͷεϚϗΞϓϦ 5XJUUFSͷεϚϗΞϓϦ ͳͲ
".1͕Α͘ग़ͯ͘Δॴ
ͯͳϒϩάʹ͓͚Δ".1
ͯͳϒϩάʹ͓͚Δ".1 :"1 BDIJNPO $"TJB)BDIJPKJͰͷൃද IUUQTCMPHTVTIJNPOFZFOUSZZBQDPKJ
ͯͳϒϩάʹ͓͚Δ".1 ͯͳϒϩάͱ ͔Βఏڙ͍ͯ͠ΔϒϩάαʔϏε ݱࡏ
ͯͳϒϩάʹ͓͚Δ".1 هࣄͷ ".1 ൛Λ৴͢Δػೳ IUUQTEFWFMPQFSIBUFOBTUB⒎DPNFOUSZ BNQ )BUFOB5FDI#PPLΛࢧ͑Δٕज़)BUFOB%FWFMPQFS#MPH FH IUUQIFMQIBUFOBCMPHDPNFOUSZBNQ
".1 ௨ৗ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ ࠶ܝ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ
ݩͷ)5.-ͷ༰Λ ".1)5.-ʹॻ͖͑Δ
ͯͳϒϩάʹ͓͚Δ".1 ͯͳϒϩά هࣄʹҙͷ)5.-Λॻ͚Δ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ༰Λ
".1)5.-ʹॻ͖͑Δ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ༰Λ
".1)5.-ʹॻ͖͑Δ
ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ҙͷ)5.-Λ
".1)5.-ʹॻ͖͑Δ
ͯͳϒϩάʹ͓͚Δ".1 ͯͳϒϩά هࣄʹҙͷ)5.-͕ॻ͚Δ ࣗಈͰ".1)5.-ʹ ॻ͖͍͑ͯ·͢
ࣗಈͰ".1)5.-ʹॻ͖͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυˠBNQUXJUUFS ộ ॻ͖͑ϙϦγʔΛॻ͘
ࣗಈͰ".1)5.-ʹॻ͖͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυˠBNQUXJUUFS ộ UZQPͳͲ༧ଌෆՄೳ ॻ͖͑ϙϦγʔΛॻ͘
৴ ࠶ܝ ".1$BDIF (PPHMF $MPVEqBSFͳͲ͕୲ ༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴʹ৴
".1)5.-͕ෆશͩͱ Ωϟογϡͯ͠Β͑ͳ͍ ࣗಈͰ".1)5.-ʹॻ͖͑Δ
༗ޮͳ".1)5.-͔Ͳ͏͔Λ ".1όϦσʔλ͕அ ࣗಈͰ".1)5.-ʹॻ͖͑Δ
༗ޮͳ".1)5.-͔Ͳ͏͔Λ ".1όϦσʔλ͕அ ࣗಈͰ".1)5.-ʹॻ͖͑Δ ".1όϦσʔλ όϦσʔγϣϯϧʔϧʹैͬͯಈ͘
ࣗಈͰ".1)5.-ʹॻ͖͑Δ ".1όϦσʔλͰΤϥʔʹͳΔՕॴΛ όϦσʔγϣϯϧʔϧʹैͬͯमਖ਼͢ΕΑ͍
ࣗಈͰ".1)5.-ʹॻ͖͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυ JGSBNF ˠBNQUXJUUFS ộ ".1όϦσʔλͷ όϦσʔγϣϯϧʔϧʹԊͬͯमਖ਼
ॻ͖͑ϙϦγʔΛॻ͘
ࣗಈͰ".1)5.-Λ͢ ".1όϦσʔλͷ όϦσʔγϣϯϧʔϧ ".1ެࣜͷϦϙδτϦʹ͋Δ IUUQTHJUIVCDPNBNQQSPKFDUBNQIUNMCMPC NBTUFSWBMJEBUPSWBMJEBUPSNBJOQSPUPBTDJJ
λά͝ͱʹϧʔϧ͕͋Δ 1SPUPDPM#VGGFST +40/ʹͯ͠ࢀর σόοά࣌ͰಡΉ όϦσʔγϣϯϧʔϧ
ϧʔϧʹແ͍λάফ͢ ྫGPOU ଐੑͷΛ͢ ྫUBSHFUIPHF ˠUBSHFU@CMBOL ࣗಈͰ".1)5.-Λ͢ ͳͲ
όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ͚ͩͰߋ৽ྃ ࣗಈͰ".1)5.-Λ͢
όϦσʔγϣϯϧʔϧΛࢀরͯ͠ Ͱ͖Δ͚ͩमਖ਼͢Δ ࣗಈͰ".1)5.-Λ͢ πʔϧͱͯ͠ެ։͠·ͨ͠ IUUQTHJUIVCDPNIPHBTIJBNQBVUPpY ͓͍͍ͩ͘͞
".1 ͷਐԽ
ʹ "DDFMFSBUFE.PCJMF1BHFT ͱͯ͠ొ ".1 ͷਐԽ
ϞόΠϧʹݶఆ͠ͳ͍ ".1 ͷਐԽ
"DDFMFSBUFE.PCJMF1BHFT ".1 ".1 ϞόΠϧʹݶఆ͠ͳ͍ ".1 ͷਐԽ
8FCϑϨʔϜϫʔΫͱͯ͑͘͠Δ 1$ͳͲͰݟΒΕΔ ϞόΠϧʹݶఆ͠ͳ͍ ".1 ͷਐԽ
".1$POGͳͲʹৄ͍͠ IUUQTBNQEFWKBFWFOUTBNQDPOG ΄͔ʹ͍Ζ͍Ζ ".1 ͷਐԽ
ͯͳϒϩά ͷਐԽ
·ͣجૅݻΊ͔Β هࣄͷ ".1 ൛ ৴ػೳΛվળ͍ͨ͠ ͯͳϒϩά ͷਐԽ
ͯͳϒϩά ͷਐԽ όϦσʔγϣϯϧʔϧͷߋ৽
όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ͚ͩͰߋ৽ྃ ࣗಈͰ".1)5.-Λ͢ ࠶ܝ
όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ ํྑ͔͚ͬͨͲ Ћ όϦσʔγϣϯϧʔϧͷߋ৽
όϦσʔγϣϯϧʔϧͷߋ৽
͓͓
None
"33": Y
ྻʹͳͬͯΔʜʜ
None
WBMVFͭͷͩͬͨ ˠྻʹ DBTFJOTFOTJUJWFͳ ͕ొ όϦσʔγϣϯϧʔϧͷߋ৽
".1ͷਐԽʹΑͬͯϧʔϧมԽ σʔλεΩʔϚ ڐՄ͞ΕΔ όϦσʔγϣϯϧʔϧͷߋ৽
มߋΛमਖ਼͢Δ͚ͩͰ ࠷৽ʹैͰ͖ͨ όϦσʔγϣϯϧʔϧج࣠(PPE ͯͳϒϩά ͷਐԽ
ͯͳϒϩά ͷਐԽ ͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔ͬͯΈ͍ͨ
ͯͳϒϩά ͷਐԽ ".1 ൛ ৴ػೳΛڧԽ͍ͨ͠ ͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔ͬͯΈ͍ͨ
ࡶஊ
HJUHSFQBNQ
HJUHSFQBNQ
HJUHSFQBNQ BNQ DBNQBJHO FYBNQMF
HJUHSFQBNQ BNQ DBNQBJHO FYBNQMF
͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔ͬͯΈ͍ͨ ͯͳϒϩά ͷਐԽ ".1 ൛ ৴ػೳΛڧԽ͍ͨ͠