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

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

A60622d38f083840b87e6a6d225c44ce?s=47 hogashi
June 26, 2019
1
1.4k

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

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

A60622d38f083840b87e6a6d225c44ce?s=128

hogashi

June 26, 2019
Tweet

More Decks by hogashi

See All by hogashi
SLTとBBCのご紹介
A60622d38f083840b87e6a6d225c44ce?s=48 hogashi
0
31
hogashi-hatena-intern-intro
A60622d38f083840b87e6a6d225c44ce?s=48 hogashi
0
39

Featured

See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
105
16k
Practical Orchestrator
168ccec72eee0530b818d44f3fedaacf?s=48 shlominoach
178
8.6k
GitHub's CSS Performance
64827b31aef81498662e8af4bd6d5157?s=48 jonrohan
1020
420k
Build The Right Thing And Hit Your Dates
016edace78ffe826f2348d1e0c504afd?s=48 maggiecrowley
19
1.2k
Building Applications with DynamoDB
39488f9d172ab92fd352f2cd7b73258d?s=48 mza
83
4.7k
Learning to Love Humans: Emotional Interface Design
5f50f94346fbcb23706f0707169317a4?s=48 aarron
261
37k
Designing Experiences People Love
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
130
22k
Fontdeck: Realign not Redesign
0bce06bd06ee7a2c4f5500f25dcf7f18?s=48 paulrobertlloyd
73
4.1k
XXLCSS - How to scale CSS and keep your sanity
1b8ad785acdd1ce1c99914b1c2a4e10e?s=48 sugarenia
236
1M
Pencils Down: Stop Designing & Start Developing
79acae287842acf29084005533a7fb3b?s=48 hursman
112
9.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Fd55de4174accaf3b4f030e43a8a70c6?s=48 marcduiker
5
510
Easily Structure & Communicate Ideas using Wireframe
0c6fd6a08d0f898159cda7cafcacf07f?s=48 afnizarnur
181
15k

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 ൛ ഑৴ػೳΛڧԽ͍ͨ͠