$30 off During Our Annual Pro Sale. View Details »

SvelteKitでストアのハイドレーションを考えてみた

kubotak
August 01, 2022
Programming
2
250

 SvelteKitでストアのハイドレーションを考えてみた

2022/07/29@Svelte交流会

kubotak

August 01, 2022
Tweet

More Decks by kubotak

See All by kubotak
Superforms本番投入で分かった良さとハマりどころ
kubotak
0
13
Storybookを書くだけでリグレッションテストが 実行される世界へようこそ
kubotak
29
8.4k
(うまくいった||いかなかった) 技術選定は何を考えていたか
kubotak
1
570
ウォーターフォールに思えたプロジェクトにあったアジャイルの要素
kubotak
2
430
Felteで作る簡単フォームバリデーション
kubotak
1
630
SvelteKitを本番投入してみて
kubotak
2
1.2k
PlaywrightによるSvelteコンポーネントテスト
kubotak
0
2.8k
AWS CDKでまるっと インフラ環境をIaCしたぞ！
kubotak
0
230
FeatureToggle戦略と運用方法
kubotak
4
14k

Other Decks in Programming

See All in Programming
進化したWeb技術でPWAをネイティブアプリに近づける / frontend-conf-2023
yuhei_fujita
6
2.6k
DMMプラットフォームにおけるコード品質を改善する取り組みの理想と現実
pospome
3
1.9k
ABEMA モバイルアプリにおける 「アーキテクチャ」 / ABEMA Mobile Architecture (CA.swift #18)
akkyie
1
400
安心してリリース！〜Blue/Greenデプロイ戦略の実体験〜 - NIFTY Tech Day 2023
niftycorp
0
150
「defineCustomElement」を活用した サービス共通のUIコンポーネントライブラリ
piyoppi
0
230
JakartaEE_for_Spring_OttawaJUG-2023.pdf
ivargrimstad
0
150
リーンスタートアップのリーンな品質の話
techouse
0
550
ユーザー登録とログインフォームにautocomplete属性を使いましょう
ivanova1991
2
1.7k
DRIVE CHARTのMLOpsを体感しよう
mot_techtalk
1
140
ニフティ開発インターンで使うAWS環境をできるだけ楽に構築した話 (LT) - NIFTY Tech Day 2023
niftycorp
0
120
re:Invent 2023 機械学習、アナリティクス系 "推し" アップデート紹介
cmnakamurashogo
0
110
OpenTelemetry の Trace を中心としたパフォーマンス改善
rmatsuoka
0
520

Featured

See All Featured
Raft: Consensus for Rubyists
vanstee
130
6k
Bootstrapping a Software Product
garrettdimon
PRO
299
110k
Fantastic passwords and where to find them - at NoRuKo
philnash
34
2.3k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
152
14k
The Invisible Customer
myddelton
113
12k
Debugging Ruby Performance
tmm1
68
11k
Robots, Beer and Maslow
schacon
154
7.7k
Product Roadmaps are Hard
iamctodd
43
9.1k
jQuery: Nuts, Bolts and Bling
dougneiner
57
6.9k
The Cult of Friendly URLs
andyhume
71
5.4k
Large-scale JavaScript Application Architecture
addyosmani
501
110k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
39
4k

Transcript

  1. Copyright© M&A
    SvelteKit
    202 2
    /
    0 7
    /
    29
    @Svelte #1 Kenjiro Kubota

    View Slide

  2. Copyright© M&A
    Profile
    kubotak-is
    kubotak_public
    kenjiro.kubota
    M&A
    (Java|Type)Script
    PHP
    https://kubotak.page
    Web Laravel ( )

    View Slide

  3. Copyright© M&A
    5

    View Slide

  4. Copyright© M&A

    View Slide

  5. Copyright© M&A
    Nuxt
    3
    (State)
    SSR useState

    View Slide

  6. Copyright© M&A
    SvelteKit


    View Slide

  7. Copyright© M&A
    SvelteKit

    View Slide

  8. Copyright© M&A
    SSR CSR HTTP API


    SSR


    SvelteKit

    View Slide

  9. Copyright© M&A

    View Slide

  10. Copyright© M&A
    1
    .SvelteKit API
    SvelteKit


    (.js|.ts)
    API


    SSR
    props


    CSR props

    View Slide

  11. Copyright© M&A

    View Slide

  12. Copyright© M&A
    aspida API


    aspida
    aspida HTTP API

    View Slide

  13. Copyright© M&A
    RequestHandlerOutput
    body

    View Slide

  14. Copyright© M&A
    2
    .Load Props
    SvelteKit Load props


    Load
    API

    View Slide

  15. Copyright© M&A

    View Slide

  16. Copyright© M&A
    Load
    props

    View Slide

  17. Copyright© M&A

    View Slide

  18. Copyright© M&A
    3.
    Svelte

    View Slide

  19. Copyright© M&A

    View Slide

  20. Copyright© M&A
    setter aspida

    View Slide

  21. Copyright© M&A
    Load setter API

    View Slide

  22. Copyright© M&A

    View Slide

  23. Copyright© M&A

    View Slide

  24. Copyright© M&A

    View Slide

  25. Copyright© M&A


    ⾒


    Svelte


    Svelte(Kit)

    View Slide

  26. Copyright© M&A
    :-0

    View Slide

  27. Copyright© M&A
    SvekteKit Store session
    Store


    LT
    1
    .
    0
    .
    0
    -next.
    377

    View Slide