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
SSR+SPA
Search
Sigma
October 10, 2022
Programming
0
110
SSR+SPA
Sigma
October 10, 2022
Tweet
Share
More Decks by Sigma
See All by Sigma
Proxmox_VE.pdf
seiyasugimoto
0
100
Stable Diffusionで遊んでみた
seiyasugimoto
0
110
EVAフレームワーク
seiyasugimoto
0
78
Nuxtにおける設計
seiyasugimoto
0
77
Atomic Designを ディレクトリ以外で表現
seiyasugimoto
0
67
throttleすげぇぇぇ
seiyasugimoto
0
75
スマホでPythonしたい
seiyasugimoto
0
60
平文で保存するな!
seiyasugimoto
0
82
ソースコードを読もう
seiyasugimoto
0
77
Other Decks in Programming
See All in Programming
マイクロサービス基盤にフルマネージドサービスではなくKubernetesを選択する理由
bgpat
7
1.8k
コンテナと文字列の中間インタフェースspanとstring_view
faithandbrave
1
190
C++23 スタックトレースライブラリ
faithandbrave
0
140
Railsでクリーンアーキテクチャを考えてきた
suzukimar
5
940
Vertical Architectures for Scalable Angular Applications
manfredsteyer
PRO
0
180
なぜキャッシュメモリは速いのか / Why is Cache Memory So Fast?
tomzoh
1
150
SPLから始める「データ構造」入門
o0h
PRO
2
180
エンジニア向け 株式会社バックテック 会社紹介資料 / for Engineers
backtech
1
440
Event Exhibition with Hono
naporin0624
0
100
Android アプリのプロジェクトをモダンにし続ける工夫
numeroanddev
1
380
RubyKaigi First Effects 〜はじめてのRubyKaigi〜
satoseri
0
290
ぎゃるえんじにあがハッカソンの虜になった!
rino7_tech
1
230
Featured
See All Featured
Product Roadmaps are Hard
iamctodd
PRO
46
9.9k
Happy Clients
brianwarren
93
6.5k
What's in a price? How to price your products and services
michaelherold
238
11k
The Language of Interfaces
destraynor
151
23k
Web Components: a chance to create the future
zenorocha
306
41k
Git: the NoSQL Database
bkeepers
PRO
423
64k
[RailsConf 2023] Rails as a piece of cake
palkan
31
4.2k
Art, The Web, and Tiny UX
lynnandtonic
290
19k
The Cult of Friendly URLs
andyhume
74
5.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
Atom: Resistance is Futile
akmur
260
25k
Writing Fast Ruby
sferik
623
60k
Transcript
SSR+SPA Nuxt+Vuex
SSR(+SPA) とは • SSR とは ◦ サーバーサイドレンダリングの略。 クライアントサイド(SPA)と サーバーサイ ドの
HTMLレンダリングを 併用しユーザー体験を向 上させることを指す。
冷静に考えるととんでもないことをやってる • サービス内の別のページからリンクすると クライアントサイドで レンダリングされる。 • そのページをF5を押して再読み込みすると サーバーサイドでレ ンダリングされる …
は?
なんでそんなクソ面倒くさいことを? • サーバーサイドでレンダリングするならテンプレートエンジンを使った昔ながらの 方法でやれば良いじゃない。 • SPAが必要なほど複雑なフロントエンドで、OGPのクローラの面倒を見たりSNS でシェアされた際のファーストビューの速さが問題になる要件そうそう無いで しょ。 つい先日あった
Nuxtで対応 • NuxtにはSSRサポートがある これで勝つる わけなかった
案件当時の標準的なNuxtプロジェクト • Nuxt + TypeScript を実現するために外部ライブラリを使う ◦ nuxt-property-decorator ( vue-property-decorator
) ◦ vuex-module-decorator • vuex-module-decorator の issue にとんでもないコメントを見つけてしまう。 ◦ https://github.com/championswimmer/vuex-module-decorators/issues/146#issuecomm ent-515269904
SSRのバグのソリューションを探った 結果、getModule() に根深い問題が ありそう。 このリポジトリは大規 模なオーバーホール 無しではSSRでは使 えない。
終わった……
None
Readmeに書いてある おまじないの意味を知る
exportしてるpluginsがキモ getModule()しているのがポイント
I GOT KOTONAKI……