[{"data":1,"prerenderedAt":274},["ShallowReactive",2],{"talks":3},[4,77,114,154,194,234],{"id":5,"title":6,"body":7,"date":63,"description":64,"event":65,"extension":66,"location":67,"meta":68,"navigation":69,"path":70,"seo":71,"slidesEmbedUrl":72,"slidesUrl":73,"stem":74,"videoUrl":75,"__hash__":76},"talks\u002Ftalks\u002Fvue-fes-japan-2025.md","Nuxt 4 の Singleton Data Fetching Layer で何が変わるのか",{"type":8,"value":9,"toc":57},"minimark",[10,14,18,30,33,46],[11,12,13],"h2",{"id":13},"概要",[15,16,17],"p",{},"Vue Fes Japan 2025 で「Nuxt 4 の Singleton Data Fetching Layer で何が変わるのか」というタイトルで登壇しました。",[15,19,20,21,25,26,29],{},"Singleton Data Fetching Layer は Nuxt 3.17 で導入された機能で、",[22,23,24],"code",{},"useAsyncData"," \u002F ",[22,27,28],{},"useFetch"," のデータ取得の仕組みが大きく改善されました。",[11,31,32],{"id":32},"トピック",[34,35,36,40,43],"ul",{},[37,38,39],"li",{},"Nuxt 3.17以前の問題点：データは共有されるが、fetcherが重複実行される",[37,41,42],{},"Singleton Data Fetching Layer による改善",[37,44,45],{},"Reactiveな値を key に指定できるようになった",[15,47,48,49,56],{},"詳細は ",[50,51,55],"a",{"href":52,"rel":53},"https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba",[54],"nofollow","Speaker Deck"," の資料をご覧ください。",{"title":58,"searchDepth":59,"depth":59,"links":60},"",2,[61,62],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2025-10-25","Nuxt 3.17で導入されたSingleton Data Fetching Layerによって、useAsyncData\u002FuseFetchのデータ取得の仕組みがどう改善されたのかを5分間のLTで解説しました。","Vue Fes Japan 2025","md","東京",{},true,"\u002Ftalks\u002Fvue-fes-japan-2025",{"title":6,"description":64},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002F1ee1a1dd203341b3a2d238df0b347ed0","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Fnuxt-4-no-singleton-data-fetching-layer-de-he-gabian-warunoka","talks\u002Fvue-fes-japan-2025",null,"JVjh0wm2BMx3Qlty_GTlJcC9M3EVEwgnWJ1e1Bwxc3k",{"id":78,"title":79,"body":80,"date":104,"description":105,"event":106,"extension":66,"location":75,"meta":107,"navigation":69,"path":108,"seo":109,"slidesEmbedUrl":110,"slidesUrl":111,"stem":112,"videoUrl":75,"__hash__":113},"talks\u002Ftalks\u002Flaravel-phpstan.md","Laravel + PHPStan で実現する静的解析入門",{"type":8,"value":81,"toc":100},[82,84,87,89],[11,83,13],{"id":13},[15,85,86],{},"Laravel プロジェクトに PHPStan を導入して、静的解析による品質向上を実現する方法を解説しました。",[11,88,32],{"id":32},[34,90,91,94,97],{},[37,92,93],{},"PHPStan の基本的な使い方",[37,95,96],{},"Laravel プロジェクトへの導入方法",[37,98,99],{},"静的解析のベストプラクティス",{"title":58,"searchDepth":59,"depth":59,"links":101},[102,103],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2025-06-28","LaravelプロジェクトにPHPStanを導入して、静的解析による品質向上を実現する方法を解説しました。","PHP カンファレンス 2025",{},"\u002Ftalks\u002Flaravel-phpstan",{"title":79,"description":105},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002Fb0bdbd382372413f949a9ddb5bc137d7","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Flaravel-plus-phpstanteshi-merushi-jian-de-jing-de-jie-xi-ru-men","talks\u002Flaravel-phpstan","0enZTaar0AVn2kTR-cOYgG6RFVj5PMhRalZqED2O1f4",{"id":115,"title":116,"body":117,"date":144,"description":145,"event":146,"extension":66,"location":75,"meta":147,"navigation":69,"path":148,"seo":149,"slidesEmbedUrl":150,"slidesUrl":151,"stem":152,"videoUrl":75,"__hash__":153},"talks\u002Ftalks\u002Fvue-capacitor.md","Web から モバイルへ Vue.js × Capacitor 活用事例",{"type":8,"value":118,"toc":140},[119,121,124,126],[11,120,13],{"id":13},[15,122,123],{},"Vue.js で構築した Web アプリケーションを、Capacitor を使ってモバイルアプリに展開した実践事例を紹介しました。",[11,125,32],{"id":32},[34,127,128,131,134,137],{},[37,129,130],{},"Capacitor の基本概念",[37,132,133],{},"Vue.js との統合方法",[37,135,136],{},"ネイティブ機能へのアクセス",[37,138,139],{},"実際のプロダクトでの活用事例",{"title":58,"searchDepth":59,"depth":59,"links":141},[142,143],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2025-06-13","Vue.jsで構築したWebアプリケーションを、Capacitorを使ってモバイルアプリに展開した実践事例を紹介しました。","Vue.js v-tokyo Meetup #23",{},"\u002Ftalks\u002Fvue-capacitor",{"title":116,"description":145},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002Fb5b9ae0d828b46f39dc0e742ce65e7ae","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Fwebkaramobairuhe-vue-dot-js-x-capacitor-huo-yong-shi-li","talks\u002Fvue-capacitor","BQ_m7tn9g_XQHQtjaJlDyGNCE6eMwNMMsKJ74_w0sRw",{"id":155,"title":156,"body":157,"date":184,"description":185,"event":186,"extension":66,"location":75,"meta":187,"navigation":69,"path":188,"seo":189,"slidesEmbedUrl":190,"slidesUrl":191,"stem":192,"videoUrl":75,"__hash__":193},"talks\u002Ftalks\u002Fpinia-colada.md","Pinia Colada が実現するスマートな非同期処理",{"type":8,"value":158,"toc":180},[159,161,164,166],[11,160,13],{"id":13},[15,162,163],{},"Pinia Colada を使った非同期データ管理の新しいアプローチと、その実践的な活用方法を解説しました。",[11,165,32],{"id":32},[34,167,168,171,174,177],{},[37,169,170],{},"Pinia Colada の基本概念",[37,172,173],{},"データフェッチングのベストプラクティス",[37,175,176],{},"キャッシュ戦略",[37,178,179],{},"既存プロジェクトへの導入方法",{"title":58,"searchDepth":59,"depth":59,"links":181},[182,183],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2024-10-30","Pinia Coladaを使った非同期データ管理の新しいアプローチと、その実践的な活用方法を解説しました。","Vue Fes Japan 2024 After Night",{},"\u002Ftalks\u002Fpinia-colada",{"title":156,"description":185},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002F4a1bb9c106e441c791ddc66cfe1a0577","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Fpinia-colada-gashi-xian-surusumatonafei-tong-qi-chu-li","talks\u002Fpinia-colada","NExr5smJp4NWYPIOhoVU1QMZr5nXLKwEzwJDIXL_dt4",{"id":195,"title":196,"body":197,"date":224,"description":225,"event":226,"extension":66,"location":75,"meta":227,"navigation":69,"path":228,"seo":229,"slidesEmbedUrl":230,"slidesUrl":231,"stem":232,"videoUrl":75,"__hash__":233},"talks\u002Ftalks\u002Funplugin-vue-router.md","unplugin-vue-router で実現する Nuxt 風ファイルベースルーティング",{"type":8,"value":198,"toc":220},[199,201,204,206],[11,200,13],{"id":13},[15,202,203],{},"unplugin-vue-router を使って、Vite プロジェクトでも Nuxt のような快適なファイルベースルーティングを実現する方法を紹介しました。",[11,205,32],{"id":32},[34,207,208,211,214,217],{},[37,209,210],{},"unplugin-vue-router の基本概念",[37,212,213],{},"ファイルベースルーティングのメリット",[37,215,216],{},"型安全なルーティング",[37,218,219],{},"実際のプロジェクトへの導入ステップ",{"title":58,"searchDepth":59,"depth":59,"links":221},[222,223],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2024-10-17","unplugin-vue-routerを使って、ViteプロジェクトでもNuxtのような快適なファイルベースルーティングを実現する方法を紹介しました。","Vue Fes Japan 2024 Pre LT Party",{},"\u002Ftalks\u002Funplugin-vue-router",{"title":196,"description":225},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002Ff0912dc271094658b9ec37578d08401d","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Funplugin-vue-routerteshi-xian-suru-nuxt-feng-huairuhesuruteinku","talks\u002Funplugin-vue-router","0K974qKur-CjU_f5wnpJNcPOpNq8WmUsGuHTHU3vTmw",{"id":235,"title":236,"body":237,"date":264,"description":265,"event":266,"extension":66,"location":75,"meta":267,"navigation":69,"path":268,"seo":269,"slidesEmbedUrl":270,"slidesUrl":271,"stem":272,"videoUrl":75,"__hash__":273},"talks\u002Ftalks\u002Fvueuse.md","VueUse 5分で分かる Vue.js 開発の効率化術",{"type":8,"value":238,"toc":260},[239,241,244,246],[11,240,13],{"id":13},[15,242,243],{},"VueUse の便利なコンポーザブル関数を活用して、Vue.js 開発を効率化するテクニックを 5 分で解説しました。",[11,245,32],{"id":32},[34,247,248,251,254,257],{},[37,249,250],{},"VueUse とは",[37,252,253],{},"よく使う便利な関数の紹介",[37,255,256],{},"実践的な活用例",[37,258,259],{},"パフォーマンス改善のヒント",{"title":58,"searchDepth":59,"depth":59,"links":261},[262,263],{"id":13,"depth":59,"text":13},{"id":32,"depth":59,"text":32},"2024-07-26","VueUseの便利なコンポーザブル関数を活用して、Vue.js開発を効率化するテクニックを5分で解説しました。","Vue.js v-tokyo Meetup #21",{},"\u002Ftalks\u002Fvueuse",{"title":236,"description":265},"https:\u002F\u002Fspeakerdeck.com\u002Fplayer\u002F515df271e9c347cd9b0ab5d7af5ebb55","https:\u002F\u002Fspeakerdeck.com\u002Fnaokihaba\u002Fvueuse-5fen-defen-karu-vue-dot-js-kai-fa-noxiao-lu-hua-shu","talks\u002Fvueuse","peHYWvuEZXDINZJ3r_hxlTCJxm2qQrXc1aeHFRN7DJc",1773664053768]