Upgrade to Pro — share decks privately, control downloads, hide ads and more …

進化するAMPとはてなブログ / AMP and HatenaBlog Evolve

Avatar for hogashi hogashi
June 26, 2019
1
1.9k

進化するAMPとはてなブログ / AMP and HatenaBlog Evolve

Hatena Engineer Seminar #12 (2019/06/26, 2019/07/03)

Avatar for hogashi

hogashi

June 26, 2019
Tweet

More Decks by hogashi

See All by hogashi
SLTとBBCのご紹介
Avatar for hogashi hogashi
0
60
hogashi-hatena-intern-intro
Avatar for hogashi hogashi
0
48

Featured

See All Featured
Practical Orchestrator
Avatar for Shlomi Noach shlominoach
190
11k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
31
6.1k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
850
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
Done Done
Avatar for chrislema chrislema
185
16k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.1k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
188
55k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
3
620
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.4k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
330
21k

Transcript

  1. ਐԽ͢Δ".1ͱ ͸ͯͳϒϩά JEIPHBTIJ )BUFOB&OHJOFFS4FNJOBS

  2. גࣜձࣾ͸ͯͳ ೖࣾ ΞϓϦέʔγϣϯΤϯδχΞ ͸ͯͳϒϩά 1FSM+BWB4DSJQU JEIPHBTIJ

  3. JEIPHBTIJ ೖࣾ

  4. JEIPHBTIJ ೖࣾ ৽ଔͰ͢

  5. ࿩͢͜ͱ ".1 ͷ঺հ ͸ͯͳϒϩά ʹ͓͚Δ ".1 ͷ঺հ ".1 ͷਐԽ ͸ͯͳϒϩά

    ͷਐԽ

  6. ".1 IUNM⚡ ϨϯμϦϯά͕଎͍

  7. ".1 ߴ଎ʹදࣔͰ͖Δ8FCϖʔδΛ ؆୯ʹͭͬͨ͘Γ͢ΔͨΊͷ Φʔϓϯιʔεͳ 8FCϑϨʔϜϫʔΫ

  8. ".1 8FCϖʔδΛߴ଎ʹදࣔ

  9. ".1 8FCϖʔδΛߴ଎ʹදࣔ ഑৴ ϨϯμϦϯά

  10. ܾ·ͬͨܗͰॻ͘".1)5.- ϨϯμϦϯά

  11. ܾ·ͬͨܗͰॻ͘".1)5.- ϥϯλΠϜΛಡΈࠐΉ".1+4 ϨϯμϦϯά

  12. ܾ·ͬͨܗͰॻ͘".1)5.- ϥϯλΠϜΛಡΈࠐΉ".1+4 ".1+4͕".1)5.-Λ ϨϯμϦϯά ϨϯμϦϯά

  13. ߴ଎ͳϨϯμϦϯάͷͨΊʹ੍ݶ͕͋Δ ".1)5.-

  14. ߴ଎ͳϨϯμϦϯάͷͨΊʹ੍ݶ͕͋Δ ɾࣗ༝ͳTDSJQU͸ॻ͚ͳ͍ ɾJNHͰ͸ͳ͘BNQJNH w XJEUI IFJHIUͷࢦఆ͕ඞਢ ".1)5.- ͳͲ

  15. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ

  16. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ಺༰Λ

    ".1)5.-ʹॻ͖׵͑Δ

  17. ഑৴ ".1$BDIF

  18. ༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴ଎ʹ഑৴ ഑৴ ".1$BDIF

  19. ഑৴ ".1$BDIF (PPHMF $MPVEqBSFͳͲ͕୲౰ ༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴ଎ʹ഑৴

  20. ߴ଎ͳϨϯμϦϯά ߴ଎ͳίϯςϯπ഑৴ ".1 ⚡

  21. ".1͕Α͘ग़ͯ͘Δ৔ॴ εϚϗͰͷ(PPHMFݕࡧ݁Ռ ͸ͯͳϒοΫϚʔΫͷεϚϗΞϓϦ 5XJUUFSͷεϚϗΞϓϦ ͳͲ

  22. ".1͕Α͘ग़ͯ͘Δ৔ॴ

  23. ͸ͯͳϒϩάʹ͓͚Δ".1

  24. ͸ͯͳϒϩάʹ͓͚Δ".1 :"1 BDIJNPO $"TJB)BDIJPKJͰͷൃද IUUQTCMPHTVTIJNPOFZFOUSZZBQDPKJ

  25. ͸ͯͳϒϩάʹ͓͚Δ".1 ͸ͯͳϒϩάͱ͸ ೥͔Βఏڙ͍ͯ͠ΔϒϩάαʔϏε ݱࡏ ೥໨

  26. ͸ͯͳϒϩάʹ͓͚Δ".1 هࣄͷ ".1 ൛Λ഑৴͢Δػೳ IUUQTEFWFMPQFSIBUFOBTUB⒎DPNFOUSZ BNQ )BUFOB5FDI#PPLΛࢧ͑Δٕज़)BUFOB%FWFMPQFS#MPH FH IUUQIFMQIBUFOBCMPHDPNFOUSZBNQ

  27. ".1 ௨ৗ

  28. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ".1)5.-Խ ࠶ܝ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ

    ݩͷ)5.-ͷ಺༰Λ ".1)5.-ʹॻ͖׵͑Δ

  29. ͸ͯͳϒϩάʹ͓͚Δ".1 ͸ͯͳϒϩά هࣄʹ೚ҙͷ)5.-Λॻ͚Δ

  30. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ಺༰Λ

    ".1)5.-ʹॻ͖׵͑Δ

  31. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ݩͷ)5.-ͷ಺༰Λ

    ".1)5.-ʹॻ͖׵͑Δ

  32. ϘΠϥʔϓϨʔτΛίϐϖͯ͠ ϒϩάهࣄͷ".1)5.-Խ <img ... /> <amp-img ... ></amp-img> IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ ೚ҙͷ)5.-Λ

    ".1)5.-ʹॻ͖׵͑Δ

  33. ͸ͯͳϒϩάʹ͓͚Δ".1 ͸ͯͳϒϩά هࣄʹ೚ҙͷ)5.-͕ॻ͚Δ ࣗಈͰ".1)5.-ʹ ॻ͖׵͍͑ͯ·͢

  34. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυˠBNQUXJUUFS ộ ॻ͖׵͑ϙϦγʔΛॻ͘

  35. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυˠBNQUXJUUFS ộ UZQPͳͲ͸༧ଌෆՄೳ ॻ͖׵͑ϙϦγʔΛॻ͘

  36. ഑৴ ࠶ܝ ".1$BDIF (PPHMF $MPVEqBSFͳͲ͕୲౰ ༗ޮͳ".1ϖʔδͷΈ ࠷దԽΛߦͬͯ $%/ ܦ༝Ͱߴ଎ʹ഑৴

  37. ".1)5.-͕ෆ׬શͩͱ Ωϟογϡͯ͠΋Β͑ͳ͍ ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ

  38. ༗ޮͳ".1)5.-͔Ͳ͏͔Λ ".1όϦσʔλ͕൑அ ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ

  39. ༗ޮͳ".1)5.-͔Ͳ͏͔Λ ".1όϦσʔλ͕൑அ ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ ".1όϦσʔλ͸ όϦσʔγϣϯϧʔϧʹैͬͯಈ͘

  40. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ ".1όϦσʔλͰΤϥʔʹͳΔՕॴΛ όϦσʔγϣϯϧʔϧʹैͬͯमਖ਼͢Ε͹Α͍

  41. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ JNHˠBNQJNH JGSBNFˠBNQJGSBNF 5XJUUFSΧʔυ JGSBNF ˠBNQUXJUUFS ộ ".1όϦσʔλͷ όϦσʔγϣϯϧʔϧʹԊͬͯमਖ਼ 

    ॻ͖׵͑ϙϦγʔΛॻ͘

  42. ࣗಈͰ".1)5.-Λ௚͢ ".1όϦσʔλͷ όϦσʔγϣϯϧʔϧ ".1ެࣜͷϦϙδτϦʹ͋Δ IUUQTHJUIVCDPNBNQQSPKFDUBNQIUNMCMPC NBTUFSWBMJEBUPSWBMJEBUPSNBJOQSPUPBTDJJ

  43. λά͝ͱʹϧʔϧ͕͋Δ 1SPUPDPM#VGGFST +40/ʹ௚ͯ͠ࢀর σόοά࣌͸໨ͰಡΉ όϦσʔγϣϯϧʔϧ

  44. ϧʔϧʹແ͍λά͸ফ͢ ྫGPOU ଐੑͷ஋Λ௚͢ ྫUBSHFUIPHF ˠUBSHFU@CMBOL ࣗಈͰ".1)5.-Λ௚͢ ͳͲ

  45. όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ͚ͩͰߋ৽׬ྃ ࣗಈͰ".1)5.-Λ௚͢

  46. όϦσʔγϣϯϧʔϧΛࢀরͯ͠ Ͱ͖Δ͚ͩमਖ਼͢Δ ࣗಈͰ".1)5.-Λ௚͢ πʔϧͱͯ͠ެ։͠·ͨ͠ IUUQTHJUIVCDPNIPHBTIJBNQBVUPpY ͓࢖͍͍ͩ͘͞

  47. ".1  ͷਐԽ

  48. ೥ʹ "DDFMFSBUFE.PCJMF1BHFT ͱͯ͠ొ৔ ".1  ͷਐԽ

  49. ϞόΠϧʹݶఆ͠ͳ͍ ".1  ͷਐԽ

  50. "DDFMFSBUFE.PCJMF1BHFT ".1 ".1 ϞόΠϧʹݶఆ͠ͳ͍ ".1  ͷਐԽ

  51. 8FCϑϨʔϜϫʔΫͱͯ͠޿͘࢖͑Δ 1$ͳͲͰ΋ݟΒΕΔ ϞόΠϧʹݶఆ͠ͳ͍ ".1  ͷਐԽ

  52. ".1$POGͳͲʹৄ͍͠ IUUQTBNQEFWKBFWFOUTBNQDPOG ΄͔ʹ΋͍Ζ͍Ζ ".1  ͷਐԽ

  53. ͸ͯͳϒϩά  ͷਐԽ

  54. ·ͣ͸جૅݻΊ͔Β هࣄͷ ".1 ൛ ഑৴ػೳΛվળ͍ͨ͠ ͸ͯͳϒϩά  ͷਐԽ

  55. ͸ͯͳϒϩά  ͷਐԽ όϦσʔγϣϯϧʔϧͷߋ৽

  56. όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ͚ͩͰߋ৽׬ྃ ࣗಈͰ".1)5.-Λ௚͢ ࠶ܝ

  57. όϦσʔγϣϯϧʔϧ͕ߋ৽͞ΕͨΒ GFUDI͢Δ ํ਑͸ྑ͔͚ͬͨͲ Ћ όϦσʔγϣϯϧʔϧͷߋ৽

  58. όϦσʔγϣϯϧʔϧͷߋ৽

  59. ͓΍͓΍

  60. None

  61. "33": Y

  62. ഑ྻʹͳͬͯΔʜʜ

  63. None

  64. WBMVF͸ͭͷ஋ͩͬͨ ˠ഑ྻʹ DBTFJOTFOTJUJWFͳ ஋͕ొ৔ όϦσʔγϣϯϧʔϧͷߋ৽

  65. ".1ͷਐԽʹΑͬͯϧʔϧ΋มԽ σʔλεΩʔϚ ڐՄ͞ΕΔ஋ όϦσʔγϣϯϧʔϧͷߋ৽

  66. มߋ఺Λमਖ਼͢Δ͚ͩͰ ࠷৽ʹ௥ैͰ͖ͨ όϦσʔγϣϯϧʔϧج࣠(PPE ͸ͯͳϒϩά  ͷਐԽ

  67. ͸ͯͳϒϩά  ͷਐԽ ͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔࢖ͬͯΈ͍ͨ

  68. ͸ͯͳϒϩά  ͷਐԽ ".1 ൛ ഑৴ػೳΛڧԽ͍ͨ͠ ͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔࢖ͬͯΈ͍ͨ

  69. ࡶஊ

  70. HJUHSFQBNQ

  71. HJUHSFQBNQ

  72. HJUHSFQBNQ BNQ DBNQBJHO FYBNQMF

  73. HJUHSFQBNQ BNQ DBNQBJHO FYBNQMF

  74. ͜Ε͔Β ɾBNQTPDJBMTIBSFͱ͔ ɾBNQCJOEͱ͔࢖ͬͯΈ͍ͨ ͸ͯͳϒϩά  ͷਐԽ ".1 ൛ ഑৴ػೳΛڧԽ͍ͨ͠