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
RemixアプリをCloudflare PagesにデプロイしたらTTFBが3,800msになった😥
Search
saneatsu
November 24, 2024
Programming
0
82
RemixアプリをCloudflare PagesにデプロイしたらTTFBが3,800msになった😥
結論(追記)に書いたZennのURLは以下です。
https://zenn.dev/saneatsu/articles/remix-cloudflare-ttfb-improvement
saneatsu
November 24, 2024
Tweet
Share
Other Decks in Programming
See All in Programming
実践ArchUnit ~実例による検証パターンの紹介~
ogiwarat
2
240
Go Modules: From Basics to Beyond / Go Modulesの基本とその先へ
kuro_kurorrr
0
110
AIエージェントによるテストフレームワーク Arbigent
takahirom
0
360
Bytecode Manipulation 으로 생산성 높이기
bigstark
1
180
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
コード書くの好きな人向けAIコーディング活用tips #orestudy
77web
3
270
「兵法」から見る質とスピード
ickx
0
250
Devinで実践する!AIエージェントと協働する開発組織の作り方
masahiro_nishimi
6
2.9k
〜可視化からアクセス制御まで〜 BigQuery×Looker Studioで コスト管理とデータソース認証制御する方法
cuebic9bic
3
320
Julia という言語について (FP in Julia « SIDE: F ») for 関数型まつり2025
antimon2
3
880
Webからモバイルへ Vue.js × Capacitor 活用事例
naokihaba
0
470
eBPFを用いたAIネットワーク監視システム論文の実装 / eBPF Japan Meetup #4
yuukit
3
730
Featured
See All Featured
Optimizing for Happiness
mojombo
379
70k
Building Applications with DynamoDB
mza
95
6.4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
14
1.5k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.3k
Unsuck your backbone
ammeep
671
58k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
8
640
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Transcript
RemixアプリをCloudflare Pagesに デプロイしたらTTFBが3,800ms になった
アジェンダ 1. 自己紹介 2. 対象となるアプリケーション 3. 発生している問題 4. 計測用ページの作成 5.
結果 6. 考えられる原因 7. 結論(追記)
自己紹介 若菜実農(さねあつ) @saneatsu Algoageという会社でフロントエンドエンジニアをしています DMM チャットブーストCVというLINEを使ったチャットボットを提供して います 会社ではNext.jsとReact Flowを使って社内向けプロダクトを開発して います
対象となるアプリケーション 概要 趣味で作っているキュレーションサイトみたいなもの ZennのScraps に開発記録を書いています 技術スタック Remix Cloudflare Pages shadcn/ui(Radix
+ Tailwind CSS) Prisma Turso
発生している問題 TTFBが3,800msかかっている 推奨値は3G回線で600ms ページ内遷移の場合も訪れたことないページだと3,000msくらいかかってしまう 1回行ったことあるページの場合は早い
計測用ページの作成 リポジトリ: saneatsu/remix-on-cf-pages URL: https://remix-on-cf-pages.pages.dev/ 計測用のページ 1. JSON Placeholderを使ってTodoを200件取得するページ 2.
JSON Placeholderを使ってTodoを1,000件取得するページ 3. DB(Turso)の2つのテーブルから5件ずつ、計10件のデータを取得するページ ゼロからRemix x Cloudflare Pagesのアプリを作って、以下3つのページで計測する。
結果 URL TTFB /json-placeholder-200 240 - 430 ms /json-placeholder-1000 500
- 600 ms /db-connect 1970 - 2310 ms Lighthouseによる計測結果(各ページ3回測定) 。
考えられる原因 Cloudflareの設定? 初回のアクセスだからCloudflareのキャッシュの設定ではないはず TursoのCold start? Tursoは無料プランだとCold startが発生する ということで月9ドルの有料プランにしてみたが計測結果が変わらなかった
結論(追記) 結論、原因はORMとしてPrismaを使用していることで、Drizzleに移行することで問題を回避できました 詳細は以下の記事にまとめました Cloudflare Pages(Workers)でPrismaを使うとサーバーからデータを取得するのに時間がかかってしまう | Zenn