search

ECMaker / blog

https://blog.ec-maker.com/
0 stars 0 forks source link

fix/#94 ISR to SSG 検討 → 中止 #98

Closed u-ecmaker closed 1 month ago

u-ecmaker commented 1 month ago

fix/#94 ISR to SSG fix.

ssgへの変更を検討

結論

現状維持、ISRのコード(revalidate) を保持する。
検討の結果、コードのrevalidateを消してssgにしても応答性は大差なし。 2bebb53

~~それ以前に、おそらく現状がISRで機能していない。SSGの動作になっているっぽい。
notionを更新しても更新されないし。。~~
サーバーの設定がうまく出来ていないと思われる。
→間違い
shin様ご指摘
https://x.com/Shin_Engineer/status/1849669396689772986
image

まあ、Actionsで30分毎にbuildしているので、SSGの動作になっていても問題ないと判断する。
コードはssgにしておいても良いが、一応ISRのコード(現状のまま)としておく。
→ ISRでワークしているので、ISRのまま残す。

revalidate 61sに変えてもISRの挙動にならず、SSGの挙動のまま変化なかった。 03929a8
(Notion更新しても変更されず。) → shin様ご指摘後、再確認。
デプロイ環境で60sほど待てばISRで更新されていることが分かった！
Actionsでbuildし続けなくてもOKということだが、画像のリンク切れ問題だけが再々燃することになる。
とりあえず30分毎でbuildするActionsは残すことにする。
また、画像更新問題があるのでbuild Actionsの定期実行を残す。

今後の課題

shin様ご指摘どおり

ISRでもビルド時にSSGと同じ挙動になりますね。ただ、ISRを例えば30秒に設定すると30秒後に再びページに訪れると裏でキャッシュ再検証が行われますね(その訪問時には古いデータが1度返却されますが)。ポスト数が多くなると再ビルドに時間がかかるので、ISRも捨てがたいですね(これは僕も検討します)

→ #99 立てました。

検討

検討結果 SSG

https://671af35492b34ba20bc1e349--blog-ecmaker.netlify.app/posts/Notion-Block-Preview

現状 ISR (の設定をしたつもりだがSSGになっている(?))

https://6719f2cb37025880c025702c--blog-ecmaker.netlify.app/posts/Notion-Block-Preview

github-actions[bot] commented 1 month ago
Netlify Build Log​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags accountId: 64825fd12059ab0e3dd39238 ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context production ​ ❯ Using Next.js Runtime - v4.41.3 ​ ❯ Outdated plugins - @netlify/plugin-nextjs@4.41.3: latest version is 5.8.1 To upgrade this plugin, please update its version in "package.json" No Next.js cache to restore. ​ Build command from Netlify app ──────────────────────────────────────────────────────────────── ​ $ yarn run build yarn run v1.22.22 $ next build info - Linting and checking validity of types... ./src/server/utils/algolia.ts 20:45 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/server/utils/ogp.ts 52:16 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any 52:57 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/utils/storage.ts 9:53 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules info - Creating an optimized production build... info - Compiled successfully info - Collecting page data... info - Generating static pages (0/39) MyInputFileListComponent inputFiles null MyInputFileComponent inputFiles [] MyInputMultiFileListComponent inputFiles null MyInputMultiFileListControlComponent inputFiles null info - Generating static pages (9/39) info - Generating static pages (19/39) info - Generating static pages (29/39) info - Generating static pages (39/39) info - Finalizing page optimization... Route (pages) Size First Load JS ┌ ● / (4231 ms) 2.25 kB 169 kB ├ /_app 0 B 167 kB ├ ○ /404 486 B 167 kB ├ λ /api/auth/[...nextauth] 0 B 167 kB ├ λ /api/hello 0 B 167 kB ├ λ /api/notion-blog/comments 0 B 167 kB ├ λ /api/notion-blog/likes/[page_id] 0 B 167 kB ├ ℇ /api/notion-blog/og 0 B 167 kB ├ λ /api/ogp 0 B 167 kB ├ ○ /contact (381 ms) 6.28 kB 300 kB ├ ○ /login 2.01 kB 169 kB ├ ● /posts (2162 ms) 17.2 kB 215 kB ├ ● /posts/[slug] (77866 ms) 19.2 kB 458 kB ├ ├ /posts/Notion-Block-Preview (11793 ms) ├ ├ /posts/logo (10177 ms) ├ ├ /posts/notion-blog_image-issue (7835 ms) ├ ├ /posts/notion-blog_google-analytics (6442 ms) ├ ├ /posts/next.js_TipTap_plugin (6250 ms) ├ ├ /posts/icon (5883 ms) ├ ├ /posts/kakuteishinkoku_r5 (5598 ms) ├ └ [+11 more paths] (avg 2172 ms) ├ ● /profile (326 ms) 1.09 kB 315 kB ├ ● /sandbox 839 B 198 kB ├ ○ /sandbox/input-file-list 1.55 kB 225 kB ├ λ /sandbox/nextjs-ssr 907 B 315 kB ├ ● /sandbox/notion-blocks-preview (4920 ms) 4.2 kB 318 kB ├ ○ /sandbox/react-hook-form 21.3 kB 244 kB ├ ○ /sandbox/react-memo 869 B 224 kB ├ ○ /sandbox/react-use-memo 707 B 224 kB ├ ○ /sandbox/rive 24.4 kB 247 kB ├ ○ /sandbox/shape-by-css 1.02 kB 168 kB ├ ○ /sandbox/svgr 2.1 kB 225 kB ├ ○ /sandbox/swr 2.33 kB 230 kB ├ ○ /sandbox/touch-event 1.68 kB 225 kB ├ ○ /sandbox/view-transitions-api 1.23 kB 224 kB ├ ○ /sandbox/view-transitions-api/other 922 B 168 kB └ ○ /sandbox/worldcoin (367 ms) 311 kB 541 kB + First Load JS shared by all 174 kB ├ chunks/framework-ce84985cd166733a.js 45.2 kB ├ chunks/main-4da6185358dbe7bf.js 26.9 kB ├ chunks/pages/_app-5ab992d176049a74.js 92.7 kB ├ chunks/webpack-215200621d8945fb.js 1.89 kB └ css/9dba346ae5c2fd17.css 6.87 kB ℇ (Streaming) server-side renders with streaming (uses React 18 SSR streaming or Server Components) λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps) ○ (Static) automatically rendered as static HTML (uses no initial props) ● (SSG) automatically generated as static HTML + JSON (uses getStaticProps) Done in 100.30s. ​ (build.command completed in 1m 40.4s) NextAuth package detected, setting NEXTAUTH_URL environment variable to https://blog.ec-maker.com Moving static page files to serve from CDN... Moved 62 files to CDN You are not using Netlify Edge Functions for image format detection. Set env var "NEXT_FORCE_EDGE_IMAGES=true" to enable. ✨ Deploying middleware and functions to Netlify Edge Functions ✨ ​ Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Functions from .netlify/functions-internal directory: - ___netlify-handler/___netlify-handler.js - ___netlify-odb-handler/___netlify-odb-handler.js - _ipx/_ipx.js ​ ​ (Functions bundling completed in 2m 5.1s) ​ Edge Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Edge Functions from .netlify/edge-functions directory: - next_pages_api_notion_blog_og ​ (Edge Functions bundling completed in 6.1s) Next.js cache saved. Deploy path: /home/runner/work/blog/blog/.next Deploying to draft URL... ​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags auth: nfp_GoRr3esto6qez5kYyUhqYYVSpSHm3zB166e2 build: true deployId: 671ae500c6e19e91b4be7e6d open: false prod: false prodIfUnlocked: false site: 80899a26-cfcb-42f8-886e-c84364cdaae9 skipFunctionsCache: false ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context dev ​ Netlify Build Complete ──────────────────────────────────────────────────────────────── ​ (Netlify Build completed in 4m 10s)
Build logs: https://app.netlify.com/sites/blog-ecmaker/deploys/671ae500c6e19e91b4be7e6d Function logs: https://app.netlify.com/sites/blog-ecmaker/logs/functions?scope=deploy:671ae500c6e19e91b4be7e6d Edge function Logs: https://app.netlify.com/sites/blog-ecmaker/logs/edge-functions?scope=deployid:671ae500c6e19e91b4be7e6d Website draft URL: https://671ae500c6e19e91b4be7e6d--blog-ecmaker.netlify.app If everything looks good on your draft URL, deploy it to your main site URL with the --prod flag. netlify deploy --build --prod
github-actions[bot] commented 1 month ago
Netlify Build Log​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags accountId: 64825fd12059ab0e3dd39238 ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context production ​ ❯ Using Next.js Runtime - v4.41.3 ​ ❯ Outdated plugins - @netlify/plugin-nextjs@4.41.3: latest version is 5.8.1 To upgrade this plugin, please update its version in "package.json" No Next.js cache to restore. ​ Build command from Netlify app ──────────────────────────────────────────────────────────────── ​ $ yarn run build yarn run v1.22.22 $ next build info - Linting and checking validity of types... ./src/server/utils/algolia.ts 20:45 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/server/utils/ogp.ts 52:16 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any 52:57 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/utils/storage.ts 9:53 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules info - Creating an optimized production build... info - Compiled successfully info - Collecting page data... info - Generating static pages (0/39) MyInputFileListComponent inputFiles null MyInputFileComponent inputFiles [] MyInputMultiFileListComponent inputFiles null MyInputMultiFileListControlComponent inputFiles null info - Generating static pages (9/39) info - Generating static pages (19/39) info - Generating static pages (29/39) info - Generating static pages (39/39) info - Finalizing page optimization... Route (pages) Size First Load JS ┌ ● / (613 ms) 2.25 kB 169 kB ├ /_app 0 B 167 kB ├ ○ /404 486 B 167 kB ├ λ /api/auth/[...nextauth] 0 B 167 kB ├ λ /api/hello 0 B 167 kB ├ λ /api/notion-blog/comments 0 B 167 kB ├ λ /api/notion-blog/likes/[page_id] 0 B 167 kB ├ ℇ /api/notion-blog/og 0 B 167 kB ├ λ /api/ogp 0 B 167 kB ├ ○ /contact (388 ms) 6.28 kB 300 kB ├ ○ /login 2.01 kB 169 kB ├ ● /posts (4398 ms) 17.2 kB 215 kB ├ ● /posts/[slug] (87058 ms) 19.2 kB 458 kB ├ ├ /posts/RDP_remote-desktop (11848 ms) ├ ├ /posts/icon (10100 ms) ├ ├ /posts/notion-blog_google-analytics (9968 ms) ├ ├ /posts/BI_seikika (9076 ms) ├ ├ /posts/notion-blog_image-issue (7468 ms) ├ ├ /posts/Notion-Block-Preview (6608 ms) ├ ├ /posts/logo (6500 ms) ├ └ [+11 more paths] (avg 2317 ms) ├ ● /profile (305 ms) 1.09 kB 315 kB ├ ● /sandbox 839 B 198 kB ├ ○ /sandbox/input-file-list 1.55 kB 225 kB ├ λ /sandbox/nextjs-ssr 907 B 315 kB ├ ● /sandbox/notion-blocks-preview (2212 ms) 4.2 kB 318 kB ├ ○ /sandbox/react-hook-form 21.3 kB 244 kB ├ ○ /sandbox/react-memo 869 B 224 kB ├ ○ /sandbox/react-use-memo 707 B 224 kB ├ ○ /sandbox/rive 24.4 kB 247 kB ├ ○ /sandbox/shape-by-css 1.02 kB 168 kB ├ ○ /sandbox/svgr 2.1 kB 225 kB ├ ○ /sandbox/swr 2.33 kB 230 kB ├ ○ /sandbox/touch-event 1.68 kB 225 kB ├ ○ /sandbox/view-transitions-api 1.23 kB 224 kB ├ ○ /sandbox/view-transitions-api/other 922 B 168 kB └ ○ /sandbox/worldcoin (353 ms) 311 kB 541 kB + First Load JS shared by all 174 kB ├ chunks/framework-ce84985cd166733a.js 45.2 kB ├ chunks/main-4da6185358dbe7bf.js 26.9 kB ├ chunks/pages/_app-5ab992d176049a74.js 92.7 kB ├ chunks/webpack-215200621d8945fb.js 1.89 kB └ css/9dba346ae5c2fd17.css 6.87 kB ℇ (Streaming) server-side renders with streaming (uses React 18 SSR streaming or Server Components) λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps) ○ (Static) automatically rendered as static HTML (uses no initial props) ● (SSG) automatically generated as static HTML + JSON (uses getStaticProps) Done in 101.80s. ​ (build.command completed in 1m 41.9s) NextAuth package detected, setting NEXTAUTH_URL environment variable to https://blog.ec-maker.com Moving static page files to serve from CDN... Moved 62 files to CDN You are not using Netlify Edge Functions for image format detection. Set env var "NEXT_FORCE_EDGE_IMAGES=true" to enable. ✨ Deploying middleware and functions to Netlify Edge Functions ✨ ​ Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Functions from .netlify/functions-internal directory: - ___netlify-handler/___netlify-handler.js - ___netlify-odb-handler/___netlify-odb-handler.js - _ipx/_ipx.js ​ ​ (Functions bundling completed in 2m 1.3s) ​ Edge Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Edge Functions from .netlify/edge-functions directory: - next_pages_api_notion_blog_og ​ (Edge Functions bundling completed in 6.9s) Next.js cache saved. Deploy path: /home/runner/work/blog/blog/.next Deploying to draft URL... ​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags auth: nfp_GoRr3esto6qez5kYyUhqYYVSpSHm3zB166e2 build: true deployId: 671af35492b34ba20bc1e349 open: false prod: false prodIfUnlocked: false site: 80899a26-cfcb-42f8-886e-c84364cdaae9 skipFunctionsCache: false ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context dev ​ Netlify Build Complete ──────────────────────────────────────────────────────────────── ​ (Netlify Build completed in 4m 7.9s)
Build logs: https://app.netlify.com/sites/blog-ecmaker/deploys/671af35492b34ba20bc1e349 Function logs: https://app.netlify.com/sites/blog-ecmaker/logs/functions?scope=deploy:671af35492b34ba20bc1e349 Edge function Logs: https://app.netlify.com/sites/blog-ecmaker/logs/edge-functions?scope=deployid:671af35492b34ba20bc1e349 Website draft URL: https://671af35492b34ba20bc1e349--blog-ecmaker.netlify.app If everything looks good on your draft URL, deploy it to your main site URL with the --prod flag. netlify deploy --build --prod
github-actions[bot] commented 1 month ago
Netlify Build Log​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags accountId: 64825fd12059ab0e3dd39238 ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context production ​ ❯ Using Next.js Runtime - v4.41.3 ​ ❯ Outdated plugins - @netlify/plugin-nextjs@4.41.3: latest version is 5.8.1 To upgrade this plugin, please update its version in "package.json" No Next.js cache to restore. ​ Build command from Netlify app ──────────────────────────────────────────────────────────────── ​ $ yarn run build yarn run v1.22.22 $ next build info - Linting and checking validity of types... ./src/server/utils/algolia.ts 20:45 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/server/utils/ogp.ts 52:16 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any 52:57 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any ./src/utils/storage.ts 9:53 Warning: Unexpected any. Specify a different type. @typescript-eslint/no-explicit-any info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules info - Creating an optimized production build... info - Compiled successfully info - Collecting page data... info - Generating static pages (0/39) MyInputFileListComponent inputFiles null MyInputFileComponent inputFiles [] MyInputMultiFileListComponent inputFiles null MyInputMultiFileListControlComponent inputFiles null info - Generating static pages (9/39) info - Generating static pages (19/39) info - Generating static pages (29/39) info - Generating static pages (39/39) info - Finalizing page optimization... Route (pages) Size First Load JS ┌ ● / (ISR: 61 Seconds) (1063 ms) 2.25 kB 169 kB ├ /_app 0 B 167 kB ├ ○ /404 486 B 167 kB ├ λ /api/auth/[...nextauth] 0 B 167 kB ├ λ /api/hello 0 B 167 kB ├ λ /api/notion-blog/comments 0 B 167 kB ├ λ /api/notion-blog/likes/[page_id] 0 B 167 kB ├ ℇ /api/notion-blog/og 0 B 167 kB ├ λ /api/ogp 0 B 167 kB ├ ○ /contact 6.28 kB 300 kB ├ ○ /login 2.01 kB 169 kB ├ ● /posts (ISR: 61 Seconds) (2134 ms) 17.2 kB 215 kB ├ ● /posts/[slug] (ISR: 61 Seconds) (73209 ms) 19.2 kB 458 kB ├ ├ /posts/icon (11238 ms) ├ ├ /posts/Notion-Block-Preview (8420 ms) ├ ├ /posts/notion-blog_google-analytics (7350 ms) ├ ├ /posts/logo (6790 ms) ├ ├ /posts/RDP_remote-desktop (5851 ms) ├ ├ /posts/kakuteishinkoku_r5 (4599 ms) ├ ├ /posts/next.js_TipTap_plugin (4263 ms) ├ └ [+11 more paths] (avg 2245 ms) ├ ● /profile (533 ms) 1.09 kB 315 kB ├ ● /sandbox 839 B 198 kB ├ ○ /sandbox/input-file-list 1.55 kB 225 kB ├ λ /sandbox/nextjs-ssr 907 B 315 kB ├ ● /sandbox/notion-blocks-preview (1328 ms) 4.2 kB 318 kB ├ ○ /sandbox/react-hook-form 21.3 kB 244 kB ├ ○ /sandbox/react-memo 869 B 224 kB ├ ○ /sandbox/react-use-memo 707 B 224 kB ├ ○ /sandbox/rive 24.4 kB 247 kB ├ ○ /sandbox/shape-by-css 1.02 kB 168 kB ├ ○ /sandbox/svgr 2.1 kB 225 kB ├ ○ /sandbox/swr 2.33 kB 230 kB ├ ○ /sandbox/touch-event 1.68 kB 225 kB ├ ○ /sandbox/view-transitions-api 1.23 kB 224 kB ├ ○ /sandbox/view-transitions-api/other 922 B 168 kB └ ○ /sandbox/worldcoin 311 kB 541 kB + First Load JS shared by all 174 kB ├ chunks/framework-ce84985cd166733a.js 45.2 kB ├ chunks/main-4da6185358dbe7bf.js 26.9 kB ├ chunks/pages/_app-5ab992d176049a74.js 92.7 kB ├ chunks/webpack-215200621d8945fb.js 1.89 kB └ css/9dba346ae5c2fd17.css 6.87 kB ℇ (Streaming) server-side renders with streaming (uses React 18 SSR streaming or Server Components) λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps) ○ (Static) automatically rendered as static HTML (uses no initial props) ● (SSG) automatically generated as static HTML + JSON (uses getStaticProps) (ISR) incremental static regeneration (uses revalidate in getStaticProps) Done in 92.44s. ​ (build.command completed in 1m 32.6s) NextAuth package detected, setting NEXTAUTH_URL environment variable to https://blog.ec-maker.com Moving static page files to serve from CDN... Moved 22 files to CDN You are not using Netlify Edge Functions for image format detection. Set env var "NEXT_FORCE_EDGE_IMAGES=true" to enable. ✨ Deploying middleware and functions to Netlify Edge Functions ✨ ​ Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Functions from .netlify/functions-internal directory: - ___netlify-handler/___netlify-handler.js - ___netlify-odb-handler/___netlify-odb-handler.js - _ipx/_ipx.js ​ ​ (Functions bundling completed in 1m 54.5s) ​ Edge Functions bundling ──────────────────────────────────────────────────────────────── ​ Packaging Edge Functions from .netlify/edge-functions directory: - next_pages_api_notion_blog_og ​ (Edge Functions bundling completed in 5.9s) Next.js cache saved. Deploy path: /home/runner/work/blog/blog/.next Deploying to draft URL... ​ Netlify Build ──────────────────────────────────────────────────────────────── ​ ❯ Version @netlify/build 29.55.2 ​ ❯ Flags auth: nfp_GoRr3esto6qez5kYyUhqYYVSpSHm3zB166e2 build: true deployId: 671b00d96d8fa49d52047f59 open: false prod: false prodIfUnlocked: false site: 80899a26-cfcb-42f8-886e-c84364cdaae9 skipFunctionsCache: false ​ ❯ Current directory /home/runner/work/blog/blog ​ ❯ Config file No config file was defined: using default values. ​ ❯ Context dev ​ Netlify Build Complete ──────────────────────────────────────────────────────────────── ​ (Netlify Build completed in 3m 50.5s)
Build logs: https://app.netlify.com/sites/blog-ecmaker/deploys/671b00d96d8fa49d52047f59 Function logs: https://app.netlify.com/sites/blog-ecmaker/logs/functions?scope=deploy:671b00d96d8fa49d52047f59 Edge function Logs: https://app.netlify.com/sites/blog-ecmaker/logs/edge-functions?scope=deployid:671b00d96d8fa49d52047f59 Website draft URL: https://671b00d96d8fa49d52047f59--blog-ecmaker.netlify.app If everything looks good on your draft URL, deploy it to your main site URL with the --prod flag. netlify deploy --build --prod
u-ecmaker commented 1 month ago

61sに変えても変化なかった。SSGの挙動。
(Notion更新しても変更されず。)