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

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

hogashi
June 26, 2019
1.6k

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

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

hogashi

June 26, 2019
Tweet

Transcript

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

    View full-size slide

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

    View full-size slide

  3. JEIPHBTIJ
    ೖࣾ

    View full-size slide

  4. JEIPHBTIJ
    ೖࣾ
    ৽ଔͰ͢

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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


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

    View full-size slide

  17. ഑৴
    ".1$BDIF

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  27. ϘΠϥʔϓϨʔτΛίϐϖͯ͠
    ".1)5.-Խ ࠶ܝ



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

    View full-size slide

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

    View full-size slide

  29. ϘΠϥʔϓϨʔτΛίϐϖͯ͠
    ϒϩάهࣄͷ".1)5.-Խ


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

    View full-size slide

  30. ϘΠϥʔϓϨʔτΛίϐϖͯ͠
    ϒϩάهࣄͷ".1)5.-Խ


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

    View full-size slide

  31. ϘΠϥʔϓϨʔτΛίϐϖͯ͠
    ϒϩάهࣄͷ".1)5.-Խ


    IUUQTBNQEFWEPDVNFOUBUJPOHVJEFTBOEUVUPSJBMTTUBSUDSFBUFCBTJD@NBSLVQ
    ೚ҙͷ)5.-Λ
    ".1)5.-ʹॻ͖׵͑Δ

    View full-size slide

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

    View full-size slide

  33. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ
    JNHˠBNQJNH
    JGSBNFˠBNQJGSBNF
    5XJUUFSΧʔυˠBNQUXJUUFS

    ॻ͖׵͑ϙϦγʔΛॻ͘

    View full-size slide

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

    UZQPͳͲ͸༧ଌෆՄೳ
    ॻ͖׵͑ϙϦγʔΛॻ͘

    View full-size slide

  35. ഑৴ ࠶ܝ

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  40. ࣗಈͰ".1)5.-ʹॻ͖׵͑Δ
    JNHˠBNQJNH
    JGSBNFˠBNQJGSBNF
    5XJUUFSΧʔυ JGSBNF
    ˠBNQUXJUUFS

    ".1όϦσʔλͷ
    όϦσʔγϣϯϧʔϧʹԊͬͯमਖ਼

    ॻ͖׵͑ϙϦγʔΛॻ͘

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  46. ೥ʹ
    "DDFMFSBUFE.PCJMF1BHFT
    ͱͯ͠ొ৔
    ".1

    ͷਐԽ

    View full-size slide

  47. ϞόΠϧʹݶఆ͠ͳ͍
    ".1

    ͷਐԽ

    View full-size slide

  48. "DDFMFSBUFE.PCJMF1BHFT ".1

    ".1
    ϞόΠϧʹݶఆ͠ͳ͍
    ".1

    ͷਐԽ

    View full-size slide

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

    ͷਐԽ

    View full-size slide

  50. ".1$POGͳͲʹৄ͍͠
    IUUQTBNQEFWKBFWFOUTBNQDPOG
    ΄͔ʹ΋͍Ζ͍Ζ
    ".1

    ͷਐԽ

    View full-size slide

  51. ͸ͯͳϒϩά

    ͷਐԽ

    View full-size slide

  52. ·ͣ͸جૅݻΊ͔Β
    هࣄͷ
    ".1

    ഑৴ػೳΛվળ͍ͨ͠
    ͸ͯͳϒϩά

    ͷਐԽ

    View full-size slide

  53. ͸ͯͳϒϩά

    ͷਐԽ
    όϦσʔγϣϯϧʔϧͷߋ৽

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  57. ഑ྻʹͳͬͯΔʜʜ

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    ͷਐԽ

    View full-size slide

  61. ͸ͯͳϒϩά

    ͷਐԽ
    ͜Ε͔Β
    ɾBNQTPDJBMTIBSFͱ͔
    ɾBNQCJOEͱ͔࢖ͬͯΈ͍ͨ

    View full-size slide

  62. ͸ͯͳϒϩά

    ͷਐԽ

    ".1

    ഑৴ػೳΛڧԽ͍ͨ͠
    ͜Ε͔Β
    ɾBNQTPDJBMTIBSFͱ͔
    ɾBNQCJOEͱ͔࢖ͬͯΈ͍ͨ

    View full-size slide

  63. HJUHSFQBNQ
    BNQ
    DBNQBJHO
    FYBNQMF

    View full-size slide

  64. HJUHSFQBNQ
    BNQ
    DBNQBJHO
    FYBNQMF

    View full-size slide

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

    ͷਐԽ

    ".1

    ഑৴ػೳΛڧԽ͍ͨ͠

    View full-size slide