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
Server Side Rendering with WebComponents
Search
Yosuke Onoue
March 04, 2018
Programming
0
470
Server Side Rendering with WebComponents
WebComponents.kyoto Meetup #2の発表資料です。
https://wc-kyoto.connpass.com/event/78690/
Yosuke Onoue
March 04, 2018
Tweet
Share
More Decks by Yosuke Onoue
See All by Yosuke Onoue
ネットワーク可視化の世界
likr
7
6.2k
Think About Front-end Web Development with Rust
likr
2
520
Yewにおけるoff-the-main-thread
likr
1
730
行政事業レビューデータの可視化 / Visualization of Japan's National Budget with JUDGIT!
likr
1
220
モダンJavaScript再入門 / Re-introduction to Modern JavaScript
likr
24
11k
Web-based Data Visualization with Rust and WebAssembly
likr
4
5.7k
Introduction to Graph Drawing
likr
0
480
20190707Ionic_Meetup.pdf
likr
0
420
About the end of the web
likr
2
520
Other Decks in Programming
See All in Programming
Boost Your Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
570
WordPress Playground for Developers
iambherulal
0
120
いまさら聞けない生成AI入門: 「生成AIを高速キャッチアップ」
soh9834
14
4.1k
Signal-Based Data FetchingWith the New httpResource
manfredsteyer
PRO
0
120
gen_statem - OTP's Unsung Hero
whatyouhide
1
180
SideKiqでジョブが二重起動した事象を深堀りしました
t_hatachi
0
270
パスキーのすべて / 20250324 iddance Lesson.5
kuralab
0
140
なぜselectはselectではないのか
taiyow
2
310
php-fpm がリクエスト処理する仕組みを追う / Tracing-How-php-fpm-Handles-Requests
shin1x1
5
880
S3静的ホスティング+Next.js静的エクスポート で格安webアプリ構築
iharuoru
0
200
エンジニア未経験が最短で戦力になるためのTips
gokana
0
240
ミリしらMCP勉強会
watany
4
630
Featured
See All Featured
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
30k
What's in a price? How to price your products and services
michaelherold
245
12k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
29
2k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
360
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2.1k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
12
1.4k
Java REST API Framework Comparison - PWX 2021
mraible
29
8.5k
KATA
mclloyd
29
14k
Producing Creativity
orderedlist
PRO
344
40k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Visualization
eitanlees
146
16k
Transcript
4FSWFS4JEF3FOEFSJOH XJUI8FC$PNQPOFOUT ͓ͷ͏͑ !MJLS 8FC$PNQPOFOUTLZPUP.FFUVQ
ࣗݾհ w ͓ͷ͏͑ w ژେֶֶࡍ༥߹ڭҭݚڀਪਐηϯλʔ ࡦͷͨΊͷՊֶϢχοτಛఆॿڭ w ՄࢹԽɺ࠷దԽɺΞϧΰϦζϜͷݚڀ w OHLZPUPΦʔΨφΠβʔɺ
8FC$PNQPOFOUTΓ͍ͨϚϯ
֓ཁ w ϋΠύϑΥʔϚϯεͳ8FCαΠτΛߏங͢Δ্Ͱɺ 4FSWFS4JEF3FOEFSJOH 443 ແࢹͰ͖ͳ͘ͳΓͭ ͭ͋Γ·͢ɻ8FC$PNQPOFOUTͱ4FSWFS4JEFϨϯμ Ϧϯάͷؔʹ͍͖ͭͯ߹ͬͯΈ͍ͨͱࢥ͍·͢ɻ
͖߹ͬͯΈͨ
͕ɺ
݁ಛʹͳ͍
༰ w 4FSWFS4JEF3FOEFSJOH 443 ͷඞཁੑʹ͍ͭͯɺ 1SPHSFTTJWF8FC"QQT 18" ͷಈͱڞʹղઆ w 8FC$PNQPOFOUTͱ443ͷ͖߹͍ํʹ͍ͭͯߟ͑Δ
w ͜Ε͔Βͷ8FCϑϩϯτΤϯυ։ൃʹ͍ͭͯߟ͑Δ w ·ͩ·ͩࡧதͰ͢
8FC$PNQPOFOUT͕͖ͬͯͨ
͜Ε͔Βͷ8FC։ൃ w 8FC$PNQPOFOUT w )5.-ɺ$44ɺ+BWB4DSJQUͷίϯϙʔωϯτԽ w 1SPHSFTTJWF8FC"QQT w 3FMJBCMFɺ'BTUɺ&OHBHJOH
1SPHSFTTJWF8FC"QQT 18" w IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWF XFCBQQT w 18"Λ࡞Δ࣌ͷࢦ w IUUQTEFWFMPQFSTHPPHMFDPNXFC QSPHSFTTJWFXFCBQQTDIFDLMJTU
w -JHIUIPVTF w 18"lྑ͍8FCαΠτz
-JHIUIPVTF "VEJU5PPM w 8FCαΠτΛղੳͯ͠Խ w $ISPNFʹΈࠐΈ w 1SPHSFTTJWF8FC"QQ w 1FSGPSNBODF
w "DDFTTJCJMJUZ w #FTU1SBDUJDFT
18"ϑΝʔετͳઃܭ w ޙ͚Ͱ18"ʹ͢Δͷ͍͠ w ࠷ॳ͔Β18"Λҙࣝͨ͠ઃܭ 18"ϑΝʔετ w 18"ͷ࡞Γํ
41"Λ͔ͬ͠Γ࡞Δ 4FSWJDF8PSLFSɺ8FC"QQ.BOJGFTUʹରԠ͢Δ w 41"͕࡞ΕΕ18"։ൃ͘͠ͳ͍ w ͨͩ͠ύϑΥʔϚϯε࠷దԽΛআ͘
'JSTUMPBEGBTUFWFOPO( w IUUQTEFWFMPQFSTHPPHMFDPNXFCQSPHSFTTJWF XFCBQQTDIFDLMJTUpSTUMPBEGBTUFWFOPOH w ಡΈࠐΈඵҎʢ3"*-1FSGPSNBODF.PEFMʣ w IUUQTEFWFMPQFSTHPPHMFDPNXFC GVOEBNFOUBMTQFSGPSNBODFSBJM w
(ͷԼΓ࠷େཧ.CQTʢ)4%1"ʣ w ࣮ޮʙ.CQT w 8FCϖʔδʹڐ͞ΕΔ௨৴༰ྔ.#ఔ
18"ͰͷύϑΥʔϚϯε࠷దԽ w ௨৴αΠζΛݮΒ͢ w ෆཁͳͷಡΈࠐ·ͳ͍ w NJOJGZɺѹॖ w ฒྻಡΈࠐΈ w
)551 w ΫϦςΟΧϧϨϯμϦϯάύεͷॖ w 4FSWFS4JEF3FOEFSJOH
ΫϦςΟΧϧϨϯμϦϯάύε w IUUQTEFWFMPQFSTHPPHMFDPNXFC GVOEBNFOUBMTQFSGPSNBODFDSJUJDBMSFOEFSJOH QBUI w IUUQTEFWFMPQFSTHPPHMFDPNXFC GVOEBNFOUBMTQFSGPSNBODFDSJUJDBMSFOEFSJOH QBUIDPOTUSVDUJOHUIFPCKFDUNPEFM
18" )5.-ɺ+4 ϒϥβ Ωϟογϡ "1* ॳճΞΫηε ճҎ߱ΞΫηε $44ɺFUD "QQ4IFMM*OTUBMM ͳωοτϫʔΫ
18"XJUI443 )5.-ɺ+4 ϒϥβ Ωϟογϡ "1* ॳճΞΫηε ճҎ߱ΞΫηε $44ɺFUD "QQ4IFMM*OTUBMM 4431BHF
ͳωοτϫʔΫ
18"Ͱͷ4FSWFS4JEF3FOEFSJOH w Ϋϩʔϥɺ0(1ରԠ w 1SFSFOEFSJOHͰରԠՄೳ w ॳظඳըͷߴԽ w ΫϦςΟΧϧϨϯμϦϯάύεͷॖ w
ϒϥβ͕ϦιʔεΛॱ൪ʹಡΈࠐΜͰ ॲཧ͢ΔϓϩηεΛ؆ུԽ
18"XJUI8FC$PNQPOFOUT w جຊతʹ௨ৗͷ18"ͱมԽ͠ͳ͍ w ͷ69ཁૉͷίϯϙʔωϯτԽ w ίϯϙʔωϯτͷԆಡΈࠐΈ w ฒྻಡΈࠐΈ
8FC$PNQPOFOUTΛ༻͍ͨ41"։ൃ w 41"ϑϨʔϜϫʔΫ 8FC$PNQPOFOUT w ϑϨʔϜϫʔΫͷͰ8FC$PNQPOFOUTΛར༻ w IUUQTDVTUPNFMFNFOUTFWFSZXIFSFDPN w ϑϧ8FC$PNQPOFOUT
w 8FC$PNQPOFOUTϕʔεϑϨʔϜϫʔΫͷར༻ w 1PMZNFSɺ4LBUF+4ɺ4UFO$*- w 6OJWFSTBM&4.PEVMFT
/PEFKTͰͷ&4.PEVMFTαϙʔτ w /PEFW ݄ Ͱϑϥά͖αϙʔτ͕։࢝ w FYQFSJNFOUBMNPEVMFT w /PEFWͰຊ֨ීٴ͔ w
݄ࠒϦϦʔεɺ݄ࠒ-54קࠂ w ࢀরɿIUUQUFQQFJTIBUFOBCMPHDPNFOUSZ FTNPEVMFTJOOPEFKT w ʹ&4.PEVMFTͷ͕࣌ͬͯ͘Δʢ͔ʣ
8FC$PNQPOFOUTͱ443 w 41"ϑϨʔϜϫʔΫXJUI8FC$PNQPOFOUT w 41"ϑϨʔϜϫʔΫྲྀͷ443 w "OHVMBS6OJWFSTBMɺ/FYUKTɺʜ w ϑϨʔϜϫʔΫͷΦʔόϔου w
ϑϧ8FC$PNQPOFOUT w /PEFKT PSαʔόαΠυݴޠ ΛؤுΔ w 4FSWFS4JEFͰ$VTUPN&MFNFOUTΛల։͢Δ͔ʁ
ϑϧ8FC$PNQPOFOUTͰͷ443ઓུ w ΫϥΠΞϯταΠυͰͷ$VTUPN&MFNFOUTల։ w ͏·͘ϚʔΫΞοϓ͠ͳ͚ΕฒྻಡΈࠐΈͰ͖ͳ͍ w αʔόαΠυͰͷ$VTUPN&MFNFOUTల։ w /PEFKTͰ8FC$PNQPOFOUTରԠ͠ͳ͚ΕͳΒͳ͍ w
".1UP18" w ͦͦॳظདྷ๚ͷϖʔδΛผʹ༻ҙ͢Δ
͜Ε͔Βͷ8FCϑϨʔϜϫʔΫΛໝ͢Δ w "QQ4IFMMͱ69ͷ w "QQ4IFMM w 18" ΦϑϥΠϯ 443Λલఏ w
ϧʔςΟϯάɺॳظϖΠϯτʹಛԽ w 69 w 8FC$PNQPOFOUTϕʔε w εςʔτཧ͕՝
ผղɿ131-ύλʔϯ w IUUQTEFWFMPQFSTHPPHMFDPNXFC GVOEBNFOUBMTQFSGPSNBODFQSQMQBUUFSO w 1VTIɺ3FOEFSɺ1SFDBDIFɺ-B[ZMPBE w 1PMZNFS4IPQσϞ IUUQTTIPQQPMZNFSQSPKFDUPSH w
௨৴࿏ͷۭ͖࣌ؒΛ௵͢
131-WT443 w 131- w Ϧιʔεґଘؔͷఆ͕ٛॏཁ w πʔϧͷඋʹظʁ w 443 w
/PEFKTΞϓϦͷߏஙɾӡ༻εΩϧ͕ٻΊΒΕΔ w ৽ͨͳϑϨʔϜϫʔΫͷొʹظʁ
Έ w Ϋϩʔϥɺ0(1ରԠ͚ͩͳΒ1SFSFOEFSJOHͰͰ͖Δͷ Ͱ443ෆཁͱࢥͬͯͨ w 18"ͰύϑΥʔϚϯεΛٻ͢ΔͳΒͬͺΓ443 ඞཁ͔ʁ w Ͱ443ߏஙӡ༻ෳࡶ͗͢ͳ͍͔ʁ w
&4.PEVMFTͱ131-ύλʔϯΛపఈ͢Ε443ͬ ͺΓ͍Βͳ͍ʁ
·ͱΊ w 18"ʹ8FC$PNQPOFOUTΈࠐΈՄೳ w ϋΠύϑΥʔϚϯεΛࢦ͢ͳΒ443ආ͚ΒΕͳ͍ w 8FC$PNQPOFOUTͷ׆༻Λਅ໘ʹߟ͑Δ࣌ظ w ԿΛඪͱ͢Δ͔ݟۃΊΔ w
૯߹֨ಆٕͱͯ͠ͷ18"ઃܭ w ࣝΛ૯ಈһͯ͠lྑ͍8FCαΠτzΛͭ͘Δ