[{"data":1,"prerenderedAt":768},["ShallowReactive",2],{"$f20i0yx6xgcgvm":3},{"items":4},[5,17,27,50,59,70,78,87,95,104,112,118,129,142,147,169,189,209,219,225,245,266,287,293,314,334,354,360,383,403,422,441,447,459,467,488,509,515,670,691,699,705,725,731,750,755,763],{"id":6,"type":7,"tracks":8,"start":13,"end":14,"heading":15,"programs":16},"reception","schedule",[9,10,11,12],"track1","track2","track3","track4","09:00","10:00","開場・受付",[],{"id":18,"type":19,"tracks":20,"start":14,"end":21,"heading":22,"programs":23},"opening","session",[9,10],"10:10","オープニング",[24],{"id":18,"type":19,"start":14,"end":21,"tracks":25,"title":22,"speakers":26},[9,10],[],{"id":28,"type":19,"tracks":29,"start":21,"end":30,"heading":31,"headingUrl":32,"programs":33},"keynote",[9,10],"10:50","キーノート","",[34],{"id":28,"url":32,"type":19,"start":21,"end":30,"tracks":35,"title":31,"overview":32,"speakers":36},[9,10],[37],{"id":38,"avatarUrl":39,"color":40,"attendedIndex":41,"socialUrls":42,"name":46,"title":47,"affiliation":48,"bio":49},"yyx990803","\u002Fimages\u002Favatars\u002Fevan-you.jpeg","default",1,{"x":43,"bluesky":44,"github":45},"https:\u002F\u002Fx.com\u002Fevanyou","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fevanyou.me","https:\u002F\u002Fgithub.com\u002Fyyx990803","Evan You","CEO","VoidZero","Vue.jsとViteの作者。VoidZeroのCEOとして、JavaScriptツールチェーンの開発に取り組む。",{"id":51,"type":7,"tracks":52,"start":30,"end":53,"heading":54,"programs":55,"display":56,"isPcOnly":58},"schedule-10:50-10:55-track1-track2",[9,10],"10:55","休憩",[],{"startTime":32,"endTime":32,"color":57},"primary",false,{"id":60,"type":19,"tracks":61,"start":53,"end":62,"heading":63,"programs":64},"session-10:55-11:05-track1",[9],"11:05","プラチナスポンサーセッション",[65],{"id":66,"type":19,"tracks":67,"start":53,"end":62,"title":68,"speakers":69},"platinum-sponsor-session-1",[9],"TBD",[],{"id":71,"type":19,"tracks":72,"start":53,"end":62,"heading":63,"programs":73},"session-10:55-11:05-track2",[10],[74],{"id":75,"type":19,"tracks":76,"start":53,"end":62,"title":68,"speakers":77},"platinum-sponsor-session-2",[10],[],{"id":79,"type":19,"tracks":80,"start":62,"end":81,"heading":63,"programs":82},"session-11:05-11:15-track1",[9],"11:15",[83],{"id":84,"type":19,"tracks":85,"start":62,"end":81,"title":68,"speakers":86},"platinum-sponsor-session-3",[9],[],{"id":88,"type":19,"tracks":89,"start":62,"end":81,"heading":63,"programs":90},"session-11:05-11:15-track2",[10],[91],{"id":92,"type":19,"tracks":93,"start":62,"end":81,"title":68,"speakers":94},"platinum-sponsor-session-4",[10],[],{"id":96,"type":19,"tracks":97,"start":81,"end":98,"heading":63,"programs":99},"session-11:15-11:25-track1",[9],"11:25",[100],{"id":101,"type":19,"tracks":102,"start":81,"end":98,"title":68,"speakers":103},"platinum-sponsor-session-5",[9],[],{"id":105,"type":19,"tracks":106,"start":81,"end":98,"heading":63,"programs":107},"session-11:15-11:25-track2",[10],[108],{"id":109,"type":19,"tracks":110,"start":81,"end":98,"title":68,"speakers":111},"platinum-sponsor-session-6",[10],[],{"id":113,"type":7,"tracks":114,"start":98,"end":115,"heading":116,"programs":117},"schedule-11:25-12:50-track1-track2",[9,10],"12:50","ランチタイム",[],{"id":119,"type":19,"tracks":120,"start":121,"end":122,"heading":123,"programs":124},"session-11:30-12:00-track4",[12],"11:30","12:00","学生支援スポンサーセッション",[125],{"id":126,"type":19,"tracks":127,"start":121,"end":122,"title":68,"speakers":128},"student-support-sponsor-session",[12],[],{"id":130,"type":131,"tracks":132,"start":122,"end":133,"heading":134,"programs":135},"event-12:00-12:30-track4","event",[12],"12:30","学生支援コンテンツ",[136],{"id":137,"type":131,"start":122,"end":133,"tracks":138,"url":139,"title":140,"speakers":141},"student-support-contents",[12],"\u002Fevent?session=student-support-contents#student-support-contents","学生支援限定ランチ会",[],{"id":143,"type":7,"tracks":144,"start":133,"end":115,"heading":54,"programs":145,"display":146,"isPcOnly":58},"schedule-12:30-12:50-track4",[12],[],{"startTime":32,"endTime":32,"color":57},{"id":148,"type":19,"tracks":149,"start":115,"end":150,"programs":151},"session-12:50-13:20-track1",[9],"13:20",[152],{"id":153,"url":154,"type":19,"tracks":155,"start":115,"end":150,"title":68,"overview":32,"speakers":156},"session-1","\u002Fspeaker\u002Fposva",[9],[157],{"id":158,"avatarUrl":159,"color":40,"attendedIndex":160,"socialUrls":161,"name":165,"title":166,"affiliation":167,"bio":168},"posva","\u002Fimages\u002Favatars\u002Feduardo-san-martin-morote.png",2,{"x":162,"bluesky":163,"github":164},"https:\u002F\u002Fx.com\u002Fposva","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fesm.dev","https:\u002F\u002Fgithub.com\u002Fposva","Eduardo San Martin Morote (Posva)","Vue.js Core Team","Vercel","オープンソースへの情熱を持つフロントエンドエンジニア。Vue.js Core Teamの一員としてVueエコシステムに携わる。",{"id":170,"type":19,"tracks":171,"start":115,"end":150,"programs":172},"session-12:50-13:20-track2",[10],[173],{"id":174,"url":175,"type":19,"tracks":176,"start":115,"end":150,"title":177,"overview":178,"speakers":179},"session-2","\u002Fspeaker\u002Fjp-knj",[10],"AstroとRustで考えるフロントエンドツールチェーンの今","Oxc、Lightning CSS、Rolldownなど、フロントエンドツールチェーンでは Rust が当たり前の選択肢になりつつあります。Astroでもcompiler-rsをはじめ、内部実装にRustを取り入れる流れが進んできました。\n\nしかしMarkdown\u002FMDXの処理に目を向けると、「Rust にすれば速くなる」だけでは解けない問題があります。remark\u002Frehype の互換性、シンタックスハイライト、Vite Plugin、Node.js との受け渡し、ネイティブバイナリの配布など、既存のJavaScriptエコシステムとどうつなげるのが問われます。\n\nAstroとRustからフロントエンドツールチェーンの今を考えます。\n\n解説する予定なのは\n- Astro における Rust 活用の流れ\n- Markdown\u002FMDXをRust化するときの難しさ\n- napi-rs、シンタックスハイライト、Vite Plugin から見る JavaScript エコシステムとの境界\n- OSS で実装し、提案し、既存の仕組みを刷新していく現実\n\n応募した背景になるのですが、Vue FesをきっかけにAstro Japan Communityを立ち上げる流れが生まれ、Vue AmsterdamでのAstro core teamとのやり取りを通じて、自分の実装がより大きな文脈につながっていく経験もありました。Astroのコミッターの私だから知っている。そして、今まで語ってこなかった話を共有します。\n\n▼ AstroのロードマップDiscussion\nhttps:\u002F\u002Fgithub.com\u002Fwithastro\u002Froadmap\u002Fdiscussions\u002F1195\n\n▼ xmdx のスパイク実装\nスターをしてくれてるのは、だいたいAstroのコアメンバーだったりします。\nhttps:\u002F\u002Fgithub.com\u002Fjp-knj\u002Fxmdx",[180],{"id":181,"avatarUrl":182,"color":40,"socialUrls":183,"name":181,"title":187,"affiliation":188},"jp-knj","\u002Fimages\u002Favatars\u002Fjp-knj.png",{"x":184,"bluesky":185,"github":186},"https:\u002F\u002Fx.com\u002Fjp_knj","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fjp-knj.bsky.social","https:\u002F\u002Fgithub.com\u002Fjp-knj","デザインエンジニア","Plaid, Inc.",{"id":190,"type":19,"tracks":191,"start":115,"end":150,"programs":192},"session-12:50-13:20-track3",[11],[193],{"id":194,"url":195,"type":19,"tracks":196,"start":115,"end":150,"title":197,"overview":198,"speakers":199},"session-3","\u002Fspeaker\u002Fics-ikeda",[11],"JSがこんなに減る！ HTML・CSS最新技術2026","従来はJavaScriptライブラリに頼っていたUIの一部が、今は生のHTMLとCSSで書けるようになってきました。新しいHTMLとCSSを使うことで、少ないコードでシンプルに書ける場面が増えています。本セッションでは、次の機能を紹介します。\n\n・dialog、popover、カスタマイズ可能なselect、CSSカルーセル\n・command \u002F commandfor属性\n・@starting-style、transition-behavior: allow-discrete\n・sibling-index()、attr()\n・target-current疑似クラス\n・アンカーポジショニング\n・スクロール駆動アニメーション\n\nJavaScriptで自前実装すると、アクセシビリティー、連打防止、フォーカス管理、開閉中の状態など、ケアすべきことが多くなります。ブラウザ標準の機能を使うことで、こうした処理の一部をHTML\u002FCSSに任せられることが利点です。\n\n■題材を選んだ理由\n\n筆者は、ICS MEDIAというオウンドメディアでウェブの最新機能を取り上げ、解説記事を公開してきました。記事用のオリジナルデモを作るなかで、昔（2018年頃）はVue.jsの\u003CTransitionGroup>などで四苦八苦していたモーダルUIの開発が、今はdialog要素、command属性、@starting-styleなどで素直に書けることに驚きました。この体験が、本セッションの出発点です。\n\n■具体例\nハンバーガーメニューを題材とし、dialog要素を中心とした実装方法を紹介します。\nhttps:\u002F\u002Fics.media\u002Fentry\u002F260527\u002F\nよく見かけるUIでも、新しい技術が複合的に役立つことを解説します。\n\n■参加者が持ち帰れる知見\n\n・最新HTML\u002FCSSで作れるUIの範囲\n・JavaScriptを書かずに済む部分、書くべき部分の見極め\n・Vue.jsやReactなどの状態管理と組み合わせるときの注意点\n",[200],{"id":201,"avatarUrl":202,"color":40,"socialUrls":203,"name":206,"title":207,"affiliation":208},"ics-ikeda","\u002Fimages\u002Favatars\u002Fics-ikeda.png",{"x":204,"github":205},"https:\u002F\u002Fx.com\u002Fclockmaker","https:\u002F\u002Fgithub.com\u002Fics-ikeda","池田 泰延","フロントエンドエンジニア","株式会社ICS",{"id":210,"type":131,"tracks":211,"start":115,"end":212,"heading":213,"programs":214},"event-12:50-14:50-track4",[12],"14:50","ハンズオン",[215],{"id":216,"type":131,"start":115,"end":212,"tracks":217,"title":68,"speakers":218},"hands-on",[12],[],{"id":220,"type":7,"tracks":221,"start":150,"end":222,"heading":54,"programs":223,"display":224,"isPcOnly":58},"schedule-13:20-13:35-track1-track2-track3",[9,10,11],"13:35",[],{"startTime":32,"endTime":32,"color":57},{"id":226,"type":19,"tracks":227,"start":222,"end":228,"programs":229},"session-13:35-14:05-track1",[9],"14:05",[230],{"id":231,"url":232,"type":19,"tracks":233,"start":222,"end":228,"title":234,"overview":235,"speakers":236},"session-4","\u002Fspeaker\u002Fykoizumi0903",[9],"Nuxt ContentからOxContentへ、1000ページ超のブログ基盤刷新への挑戦","Nuxt ContentとNuxtHubを用いて1000ページ以上のブログサイトを運用する中で、ドキュメント数の増加に伴うビルドパフォーマンスの悪化やメンテナンス性が大きな課題となっていました。本セッションでは、この課題を打破するためにRust製の次世代ツールであるox-contentをNuxt 4に導入した実践記録をお話しします。\n移行にあたり、他にも様々な技術を取り入れ、検索機能や画像配信などの実用的な機能を維持しながら、SSR から SSG への移行などの最適化を実施。\n大規模な静的コンテンツ配信においてパフォーマンスと開発体験を両立させるための試行錯誤を共有します。",[237],{"id":238,"avatarUrl":239,"color":40,"socialUrls":240,"name":242,"title":243,"affiliation":244},"ykoizumi0903","\u002Fimages\u002Favatars\u002Fykoizumi0903.png",{"x":241},"https:\u002F\u002Fx.com\u002Fykoizumi0903","Yutaro Koizumi","テックリード","株式会社アンドパッド",{"id":246,"type":19,"tracks":247,"start":222,"end":228,"programs":248},"session-13:35-14:05-track2",[10],[249],{"id":250,"url":251,"type":19,"tracks":252,"start":222,"end":228,"title":253,"overview":32,"speakers":254},"session-5","\u002Fspeaker\u002Fwan9chi",[10],"Vite-plus (仮)",[255],{"id":256,"avatarUrl":257,"color":40,"attendedIndex":258,"socialUrls":259,"name":263,"title":264,"affiliation":48,"bio":265},"wan9chi","\u002Fimages\u002Favatars\u002Fcharles-wang.png",4,{"x":260,"bluesky":261,"github":262},"https:\u002F\u002Fx.com\u002Fwan9chi","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fwan9chi.bsky.social","https:\u002F\u002Fgithub.com\u002Fwan9chi","Charles Wang","ソフトウェアエンジニア","Vite+のコアチームメンバーで、Vite Taskに取り組む。",{"id":267,"type":19,"tracks":268,"start":222,"end":228,"programs":269},"session-13:35-14:05-track3",[11],[270],{"id":271,"url":272,"type":19,"tracks":273,"start":222,"end":228,"title":274,"overview":275,"speakers":276},"session-6","\u002Fspeaker\u002Fktsn",[11],"なぜその UI アニメーションは気持ちいいのか？","UI にアニメーションをつけたいけど、どうすれば気持ちいいアニメーションになるかがわからない。そんな経験はありませんか？\n\n洗練されたアニメーションを標準で備えているモバイルアプリと比べて、Web のアニメーションは自分で実装しなければならない部分が多く、クオリティを高めるのは簡単ではありません。近年は View Transition API などの便利な API も追加されていますが、まだ「どのように動かすのか」はほとんど実装者にゆだねられており、センスと知識が試されます。\n\n本セッションでは UI アニメーションの「気持ちよさ」とはどういった要因から生まれるのかを分析し、それを実装に落とし込む方法を発表します。また、モバイルアプリで頻出の UI などを Vue.js で実装したものをお見せし、気持ちよさの要因を実際の UI から体感していただきます。みなさんがアニメーション実装に挑戦するきっかけとなり、いざ実装するときの手札が増えることを目指します。",[277],{"id":278,"avatarUrl":279,"color":40,"socialUrls":280,"name":284,"title":285,"affiliation":286},"ktsn","\u002Fimages\u002Favatars\u002Fktsn.png",{"x":281,"bluesky":282,"github":283},"https:\u002F\u002Fx.com\u002Fktsn","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fktsn.dev","https:\u002F\u002Fgithub.com\u002Fktsn","Katashin","CTO","kinew",{"id":288,"type":7,"tracks":289,"start":228,"end":290,"heading":54,"programs":291,"display":292,"isPcOnly":58},"schedule-14:05-14:20-track1-track2-track3",[9,10,11],"14:20",[],{"startTime":32,"endTime":32,"color":57},{"id":294,"type":19,"tracks":295,"start":290,"end":212,"programs":296},"session-14:20-14:50-track1",[9],[297],{"id":298,"url":299,"type":19,"tracks":300,"start":290,"end":212,"title":301,"overview":302,"speakers":303},"session-7","\u002Fspeaker\u002Fnaokihaba",[9],"Vite+への貢献と、Team Memberになって見えてきた風景","2026年4月からVite+のTeam Memberとして活動を続けています。これまでは、Node.jsのバージョン管理の移行支援をはじめ、tsdown関連のマイグレーションやTypeScript設定の自動変換、VueやAstro向けの型サポートの追加といった、幅広い改善に取り組んできました。\n\n開発の現場では、migratorの実装を深く読み込み、寄せられたIssueの問題を一つひとつ再現しては挙動を追いかける。そんな地道な調査の繰り返しを通じて、少しずつプロジェクトへの理解を深めてきました。現在はTeam Memberとして、世界中のユーザーから届くIssueのトリアージや、Pull Requestのレビューも日常的に行っています。\n\n外部コントリビューターだった頃には想像もしていなかったような、OSS運営ならではの難しさや面白さ、そしてそこにあるコミュニティの熱量を、役割が変わったことでより肌で感じるようになりました。\n\nこのセッションでは、Vite+での具体的な事例を交えながら、1人のコントリビューターがTeam Memberになるまでの道のりと、その過程で得た気づきを共有します。また、AIの普及で「コードを書くこと」自体のハードルが下がっている今だからこそ、あえて立ち止まって「深く理解すること」の価値についても考えてみたいと思います。\n\nOSSへの貢献に興味がある方はもちろん、これから何らかの形で関わってみたいと考えている方に向けて、単にコードを書くだけではない、OSSとのより豊かな関わり方についてお話しします。",[304],{"id":305,"avatarUrl":306,"color":40,"socialUrls":307,"name":311,"title":312,"affiliation":313},"naokihaba","\u002Fimages\u002Favatars\u002Fnaokihaba.png",{"x":308,"bluesky":309,"github":310},"https:\u002F\u002Fx.com\u002Fnaokihaba","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fnaokihaba.com","https:\u002F\u002Fgithub.com\u002Fnaokihaba","Naoki Haba","Vite+ チームメンバー","株式会社 アンドパッド",{"id":315,"type":19,"tracks":316,"start":290,"end":212,"programs":317},"session-14:20-14:50-track2",[10],[318],{"id":319,"url":320,"type":19,"tracks":321,"start":290,"end":212,"title":322,"overview":323,"speakers":324},"session-8","\u002Fspeaker\u002Fhiranuma",[10],"Vue で書く 空間コンピューティング、TresJS と WebXR を使ったXR デバイスのフロントエンド開発","Vue + TresJS + WebXR で、Meta Quest 3 や Samsung Galaxy XR などで動く空間コンピューティングアプリが書けることをご存知でしょうか。\n新しいフレームワークを覚え直すことなく、Vue Composition API の知識のまま XR デバイス向けのフロントエンドを実装できます。\n\nApple Vision Pro と Meta Quest 3 が空間コンピューティングを身近なものにし、2026 年秋には XREAL Project Aura や Snap Specs などのグラス型デバイスも順次発売されます。\nヘッドセットからグラスまで XR デバイスの選択肢が広がり、空間コンピューティングは実用領域に入りました。\n本セッションでは、Vue + TresJS + WebXR で実際に動く空間コンピューティングアプリの基礎として、視線とジェスチャーによる操作、宣言的なシーン構築、ハンドトラッキングとコントローラの両対応、物理エンジンの統合など、XR デバイス向けフロントエンド開発の実装パターンを共有します。\n",[325],{"id":326,"avatarUrl":327,"color":40,"socialUrls":328,"name":332,"title":285,"affiliation":333},"hiranuma","\u002Fimages\u002Favatars\u002Fhiranuma.png",{"x":329,"bluesky":330,"github":331},"https:\u002F\u002Fx.com\u002Fmistorun","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fmistorun.bsky.social","https:\u002F\u002Fgithub.com\u002Fhiranuma","平沼 真吾","株式会社GENEROSITY",{"id":335,"type":19,"tracks":336,"start":290,"end":212,"programs":337},"session-14:20-14:50-track3",[11],[338],{"id":339,"url":340,"type":19,"tracks":341,"start":290,"end":212,"title":342,"overview":343,"speakers":344},"session-9","\u002Fspeaker\u002Fyamanoku",[11],"Vue SFCから見直す正しいHTMLの守り方","VueのSFCにはtemplateブロックにてHTMLを記述できる構文が備わっていることは周知の事実だと思いますが、Vue.jsを使った開発をするときにどのように「HTMLの正しさ」を検証しているか皆さんは説明できますでしょうか？\nVueのSFCにおけるtemplate内ではHTMLの要素間のネスト違反があっても、開発時に警告してきますが明確にコンパイルエラーにはなりません。HTMLの字句的・構文的ルールについても検出されますが、具体的なHTML要素の使い方に関しては関与していません。\n本セッションでは、Vue SFCのtemplateブロックで書かれたHTMLの内容をコンパイラがどのように解釈しているかについてを仕組みから紐解き、DOMのコンパイラだけでは保てないHTMLの正しさについてをLinterといった静的解析エコシステム（ESLint、Markuplint、Biome、OxC、Vizeなど）たちによって今現在どのように守れるかについてを紹介します。\nHTMLの仕様はLiving Standardとして今なお更新されています。そんなHTMLと正しく向き合いながら、Vue.jsで堅牢なマークアップとHTMLによるアクセシブルなアウトプットを実現する知見を提供します。",[345],{"id":346,"avatarUrl":347,"color":40,"socialUrls":348,"name":352,"title":353,"affiliation":32},"yamanoku","\u002Fimages\u002Favatars\u002Fyamanoku.png",{"x":349,"bluesky":350,"github":351},"https:\u002F\u002Fx.com\u002Fyamanoku","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fyamanoku.net","https:\u002F\u002Fgithub.com\u002Fyamanoku","やまのく","会社員",{"id":355,"type":7,"tracks":356,"start":212,"end":357,"heading":54,"programs":358,"display":359,"isPcOnly":58},"schedule-14:50-15:05-track1-track2-track3-track4",[9,10,11,12],"15:05",[],{"startTime":32,"endTime":32,"color":57},{"id":361,"type":19,"tracks":362,"start":357,"end":363,"programs":364},"session-15:05-15:35-track1",[9],"15:35",[365],{"id":366,"url":367,"type":19,"tracks":368,"start":357,"end":363,"title":369,"overview":370,"speakers":371},"session-10","\u002Fspeaker\u002Fubugeeei",[9],"The Vue Toolchain, Reimagined","Vueの開発体験は、多くの優れたツールによって支えられています。\n\nVizeは、高速なVueツールチェーン全体をゼロから構築することを目指しているオープンソースプロジェクトです。コンパイラやリンターをはじめとするさまざまなツールを開発する中で、ツールチェーン全体を見渡すからこそ見えてくる課題や、新しい可能性がありました。\n\nこのセッションでは、Vizeの取り組みを紹介しながら、Vueツールチェーンの現在とこれからについてお話しします。",[372],{"id":373,"avatarUrl":374,"color":40,"attendedIndex":375,"socialUrls":376,"name":373,"title":380,"affiliation":381,"bio":382},"ubugeeei","\u002Fimages\u002Favatars\u002Fubugeeei.jpeg",5,{"x":377,"bluesky":378,"github":379},"https:\u002F\u002Fx.com\u002Fubugeeei","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fubugeeei.dev","https:\u002F\u002Fgithub.com\u002Fubugeeei","Vize、chibivue作者","Vite+、Vue.js、株式会社メイツ","東京を拠点に活動するソフトウェアエンジニア。株式会社メイツでチーフエンジニアを務めながら、フロントエンド設計、開発体験、パフォーマンス改善に取り組む。\n\nVue.js Core Team、Vite+ core contributorとして活動し、Vue Vaporやコミュニティ活動にも関わる。Vizeでは、Rust製のVue.jsツールチェーンとしてcompiler、linter、typechecker、formatter、story system、LSPまでを横断し、Vue開発の未来の基盤を研究している。",{"id":384,"type":19,"tracks":385,"start":357,"end":363,"programs":386},"session-15:05-15:35-track2",[10],[387],{"id":388,"url":389,"type":19,"tracks":390,"start":357,"end":363,"title":391,"overview":392,"speakers":393},"session-11","\u002Fspeaker\u002FHal-Spidernight",[10],"Vue.jsで作る空間解析アプリとCapacitorプラグインのData Bridge","みなさんはVue.jsでネイティブアプリを作ったことがありますか？\n昨今Vue3をサポートしたLynxの登場や、WebViewベースでありながらネイティブレイヤーのサポートが手厚いCapacitorなど、Webアプリの経験を活かせるネイティブフレームワークの発展によりWebエンジニアのモバイルアプリ開発を始めるハードルは大きく下がっています。\n\n一方でAVCaptureDeviceやARKitのような特定のネイティブAPIへアクセスする機能が十分でないことも事実です。\n\nでは諦めてFlutterやSwift\u002FKotlinを使うしかないのか？\n\nいえ、ネイティブレイヤーへアクセスするプラグインを作ってしまいましょう。\n\nとはいえネイティブレイヤーで扱うデータは膨大になることがあります。\n例えばLiDARを用いて収集した3Dスキャンの点群データはJavaScript\u003C — >ネイティブのバイナリ転送量が大きく、効率的な通信を行われなければ実用性に欠けてしまいます。\n\nこのセッションではARやLiDAR等を用いた空間解析アプリを主軸にJS\u003C — >ネイティブ間の転送効率化、およびWebフレームワークで効率よくネイティブAPIを扱うためのプラグイン設計についてお話します。",[394],{"id":395,"avatarUrl":396,"color":40,"socialUrls":397,"name":400,"title":401,"affiliation":402},"Hal-Spidernight","\u002Fimages\u002Favatars\u002FHal-Spidernight.png",{"x":398,"github":399},"https:\u002F\u002Fx.com\u002Fhal_spidernight","https:\u002F\u002Fgithub.com\u002FHal-Spidernight","Hal","アプリケーションエキスパート","株式会社LIXIL",{"id":404,"type":19,"tracks":405,"start":357,"end":363,"programs":406},"session-15:05-15:35-track3",[11],[407],{"id":408,"url":409,"type":19,"tracks":410,"start":357,"end":363,"title":411,"overview":412,"speakers":413},"session-12","\u002Fspeaker\u002Fis78-dev",[11],"TanStack Query VueとPinia Coladaから学ぶ非同期状態の型設計","TanStack Query VueとPinia Coladaでは、非同期データ取得の状態を扱うAPIに違いがあります。たとえば、queryの状態判定後もTypeScript上ではdataがundefinedを含む型として扱われる場合があります。本セッションでは、2つのデータ取得ライブラリのAPI設計を出発点に、型の見え方がどのように決まるのかを整理します。TanStack Query VueのuseQueryとreactiveによる型絞り込み、Pinia Coladaのstate設計を具体例として、Vueのref、toRefs、reactive、TypeScriptのdiscriminated unionの関係を見ていきます。ライブラリ比較を通じて、Vue composableで非同期状態を型安全に扱うための設計観点を共有します。",[414],{"id":415,"avatarUrl":416,"color":40,"socialUrls":417,"name":420,"title":207,"affiliation":421},"is78-dev","\u002Fimages\u002Favatars\u002Fis78-dev.png",{"x":418,"github":419},"https:\u002F\u002Fx.com\u002Faoshi_78","https:\u002F\u002Fgithub.com\u002Fis78-dev","aoshi","株式会社ヤプリ",{"id":423,"type":19,"tracks":424,"start":357,"end":363,"programs":425},"session-15:05-15:35-track4",[12],[426],{"id":427,"url":428,"type":19,"tracks":429,"start":357,"end":363,"title":430,"overview":431,"speakers":432},"session-13","\u002Fspeaker\u002Ft0daaay",[12],"決定的なフロントエンドアーキテクチャがいい","「xxx ディレクトリに設置しませんか？」「utils に切り出しませんか？」「composable 化しませんか？」「watch を使わないで computed で書けませんか？」\nこれらはフロントエンド開発の設計観点から度々発生する議論です。\n生成AIで開発速度が高速化されていく中、これらの判断を1つずつすることは現実的でしょうか？\n私がフロントエンドエンジニアとして関わる新規プロダクトでは、Nuxt を採用する中、ファイルや関数の設置場所や命名、API の使い方など、可能な限り決定的に取り決め、リンターによるガードレールを設定しています。\nその結果、殆どのPRが数分でレビューし終わる状態を実現できたり、フロントエンドに詳しくなくても開発可能な体制を整えることに成功し、堅牢かつ高速な開発環境を実現しました。\n本セッションでは、開発中の Nuxt プロジェクトのアーキテクチャを例に、実際の現場でどのような決定的な判断ルールを取り決め、迷わないアーキテクチャを構築しているかについて紹介します。",[433],{"id":434,"avatarUrl":435,"color":40,"socialUrls":436,"name":439,"title":264,"affiliation":440},"t0daaay","\u002Fimages\u002Favatars\u002Ft0daaay.png",{"x":437,"github":438},"https:\u002F\u002Fx.com\u002Ft0daaay","https:\u002F\u002Fgithub.com\u002Ft0daaay","辻佳佑","弁護士ドットコム株式会社",{"id":442,"type":7,"tracks":443,"start":363,"end":444,"heading":54,"programs":445,"display":446,"isPcOnly":58},"schedule-15:35-15:50-track1-track2-track3-track4",[9,10,11,12],"15:50",[],{"startTime":32,"endTime":32,"color":57},{"id":448,"type":131,"tracks":449,"start":444,"end":450,"heading":451,"headingUrl":452,"programs":453},"panelDiscussion-15:50-16:50-track1",[9],"16:50","パネルディスカッション","\u002Fevent?session=panel-discussion#panel-discussion",[454],{"id":455,"type":456,"start":444,"end":450,"tracks":457,"title":68,"speakers":458},"panel-discussion-1","panelDiscussion",[9],[],{"id":460,"type":131,"tracks":461,"start":444,"end":450,"heading":451,"headingUrl":452,"programs":462},"panelDiscussion-15:50-16:50-track2",[10],[463],{"id":464,"type":456,"start":444,"end":450,"tracks":465,"title":68,"speakers":466},"panel-discussion-2",[10],[],{"id":468,"type":19,"tracks":469,"start":444,"end":470,"programs":471},"session-15:50-16:20-track3",[11],"16:20",[472],{"id":473,"url":474,"type":19,"tracks":475,"start":444,"end":470,"title":476,"overview":477,"speakers":478},"session-14","\u002Fspeaker\u002Fthemarcba",[11],"The Backend is Reactive: ブラウザの枠を超える Vue","このトークは、Vueのリアクティビティをブラウザ上で実装してみせることで、その仕組みのベールを剥がすものです。プロダクション品質を目指すというより、コードで遊ぶことそのものを楽しんでいただく内容です。\n\nもしVueのリアクティビティシステムが、ブラウザの中だけにとどまらなかったとしたら？ このトークでは、バックエンドで @vue\u002Freactivity を使って何百台ものスマートフォンをリアルタイムで統率し、会場全体を同期したリアクティブなライトショーに変えてみせます。\n\n構成：\n・まず、原理を証明するための軽めのライブコーディングを行います\n・その後、画面にコードを映しながらライブデモを開始します\n・観客全員にQRコードをスキャンしてもらい、ログイン不要の超軽量ページにアクセスしてもらいます。すると各自の画面がバックエンドに制御される「ライト」に変わります。スマートフォンを掲げてもらい、うまくいけば会場全体が最大輝度で光に包まれます\n・ステージ上の「指揮者ダッシュボード」からは、色・明るさ・BPM・パターン（ソリッド、ストロボ、ウェーブ、スパークル、文字ブロック）といったいくつかのリアクティブな制御が可能です\n・バックエンドは小さなリアクティブグラフを保持しています\n　- ソースref：モード、色、明るさ、など\n　- 算出値（computed）：ビートのタイミング、クライアントごとの「バケット」、パターンの投影（例：波の位相）\n　- エフェクト：WebSocket経由での更新のプッシュ、分析ログの記録\n・ユーザーごとの命令的な配線は一切なし。ソースrefを変更するだけで、算出されたプロジェクションとエフェクトが自動的にすべてのデバイスへと変化を波及させます\n\n持ち帰れるポイント\n・Vueのリアクティビティは、UIの状態だけでなくバックエンドのロジックも統率できる\n・単一のリアクティブな信頼できる情報源（source of truth）が、最小限の接着コードで多数のクライアントを駆動できる\n・Server-Sent Events／WebSocketは、リアクティブなエフェクトによるライブなファンアウトと自然に相性が良い\n・算出されたプロジェクションによって、ユーザーごとの命令が些細かつ一貫したものになる\n・リアクティブな考え方は、副作用・スケジューリング・クリーンアップという関心事を明確にしてくれる\n\nこのトークはVue.js Amsterdamで既に披露し、好評をいただきました：\nhttps:\u002F\u002Fwww.youtube.com\u002Fwatch?v=hFgqGgaHo0U",[479],{"id":480,"avatarUrl":481,"color":40,"socialUrls":482,"name":485,"title":486,"affiliation":487},"themarcba","\u002Fimages\u002Favatars\u002Fthemarcba.png",{"x":483,"github":484},"https:\u002F\u002Fx.com\u002Fmarcba","https:\u002F\u002Fgithub.com\u002Fthemarcba","Marc Backes","Senior Software Engineer","Directus",{"id":489,"type":19,"tracks":490,"start":444,"end":470,"programs":491},"session-15:50-16:20-track4",[12],[492],{"id":493,"url":494,"type":19,"tracks":495,"start":444,"end":470,"title":496,"overview":497,"speakers":498},"session-15","\u002Fspeaker\u002Falvarosabu",[12],"Vue Fes Japan 2025 の Web サイトを TresJS と TSL（WebGPU）で再現する","このトークでは、Vue Fes Japan 2025のウェブサイトのヒーローイメージを、VueとTresJS、そしてWebGPU上で動くThree.js Shading Language（TSL）を使って再現した過程を共有します。オリジナルのシーンは素のThree.js r178で動作しており、V字型のコーン（Vueを表現）と、日本の国旗の日の丸にインスパイアされた球体を組み合わせ、日本の伝統技法である墨流し（すみながし）を再現するカスタムシェーダーでマスクをかけています。\n\nこのセットアップをTresJSのコンポーネントを使ってVueに移植した方法、シーンを宣言的に構成した方法、そして元のGLSLシェーダーのロジックを、Vueアプリの中で自然に感じられる形でTSLへと移行した方法を解説していきます。墨流しのエフェクトが、歪んだベクトル場を流れるFBMノイズからどのように構築されているか、アニメーションが時間経過とともに複数のカラーパレットをどのように循環しているか、そして従来のWebGLパイプラインの代わりにWebGPU APIを活用することで何が変わるのかを見ていきます。\n\nセッションの終わりまでに、参加者は既存のThree.jsのシーンをTresJSでVueに移植する際の考え方、複雑なシェーダーエフェクトをコンポーネント駆動のアーキテクチャの中で整理する方法、そしてVueを使って美しいビジュアル体験を作り出す方法を理解できるようになります。\n\nライブデモ：https:\u002F\u002Flab.tresjs.org\u002Fexperiments\u002Fvuefes-japan-2025\nTresJS：https:\u002F\u002Ftresjs.org\u002F",[499],{"id":500,"avatarUrl":501,"color":40,"socialUrls":502,"name":506,"title":507,"affiliation":508},"alvarosabu","\u002Fimages\u002Favatars\u002Falvarosabu.png",{"x":503,"bluesky":504,"github":505},"https:\u002F\u002Fx.com\u002Falvarosabu","https:\u002F\u002Fbsky.app\u002Fprofile\u002Falvarosaburido.dev","https:\u002F\u002Fgithub.com\u002Falvarosabu","Alvarosabu","Creative Software Engineer","TresJS",{"id":510,"type":7,"tracks":511,"start":470,"end":512,"heading":54,"programs":513,"display":514,"isPcOnly":58},"schedule-16:20-16:35-track3-track4",[11,12],"16:35",[],{"startTime":32,"endTime":32,"color":57},{"id":516,"type":517,"tracks":518,"start":512,"end":519,"heading":520,"programs":521},"lightningTalk-16:35-17:50-track3","lightningTalk",[11],"17:50","ライトニングトーク",[522,538,554,569,583,597,610,626,642,656],{"id":523,"url":524,"type":517,"tracks":525,"start":512,"end":519,"title":526,"overview":527,"speakers":528},"lightning-talk-1","\u002Fspeaker\u002FShigeyuki-fukuda",[11],"Vapor Modeでアクセシビリティは壊れないか検証した話","Vue 3.6で登場したVapor ModeはVNodeを経由せず直接DOMを操作する新しいコンパイル戦略ですが、語られるのは性能の話ばかりで、支援技術への影響はまだほとんど検証されていません。\nlive regionの読み上げ、フォーカス管理、動的なaria属性の更新は従来モードと同じように動くのか。\nこれは既存アプリへの部分導入を検討するうえで避けて通れない課題だと考え、このテーマを選びました。\n本発表では、同一のコンポーネントを従来モードとVapor Modeの2系統でビルドし、PlaywrightのariaSnapshotによるアクセシビリティツリーの差分比較と、VoiceOverによる実際の読み上げ確認という2つの観点で検証した結果を報告します。\n差分が出た項目と出なかった項目を一覧で示し、Vapor Mode移行時にアクセシビリティ観点で確認すべきチェックリストとして持ち帰っていただけます。",[529],{"id":530,"avatarUrl":531,"color":40,"socialUrls":532,"name":535,"title":536,"affiliation":537},"Shigeyuki-fukuda","\u002Fimages\u002Favatars\u002FShigeyuki-fukuda.png",{"x":533,"github":534},"https:\u002F\u002Fx.com\u002Fuqda90","https:\u002F\u002Fgithub.com\u002FShigeyuki-fukuda","福田繁之","Webエンジニア","株式会社mov",{"id":539,"url":540,"type":517,"tracks":541,"start":512,"end":519,"title":542,"overview":543,"speakers":544},"lightning-talk-2","\u002Fspeaker\u002FHasutoSasaki",[11],"あなたの await、OS まで届いてる？ strace で覗く JavaScript の非同期","普段当たり前のように async \u002F await を書きますが、「待っている間に OS は何をしているの？」 と聞かれると、曖昧な答えしか言えずモヤモヤしました。そこで本 LT では、Node.js のコードを strace でシステムコールレベルまで覗いて、JavaScript の await の正体を実際に確かめていきます。まず Promise.resolve() と fetch() を比べると、await には「OS まで降りるもの」と「降りないもの」があることが見えてきます。次に複数の fetch を「直列」と「Promise.all」で実行し、syscall のログを並べてみます。すると、並列にしているのは Promise.all そのものではなく、その効果は epoll_wait の往復をまとめている点にある、ということが分かってきます。最後に、この視点を Nuxt の useAsyncData \u002F useFetch が直列になって遅くなるケースに繋げて、「なぜ束ねると速いのか」を OS の言葉で説明できるようになって帰っていただけたらと思います。",[545],{"id":546,"avatarUrl":547,"color":40,"socialUrls":548,"name":551,"title":552,"affiliation":553},"HasutoSasaki","\u002Fimages\u002Favatars\u002FHasutoSasaki.png",{"x":549,"github":550},"https:\u002F\u002Fx.com\u002Fhasuto00","https:\u002F\u002Fgithub.com\u002FHasutoSasaki","Hasuto","バックエンドエンジニア","クラスメソッド株式会社",{"id":555,"url":556,"type":517,"tracks":557,"start":512,"end":519,"title":558,"overview":559,"speakers":560},"lightning-talk-3","\u002Fspeaker\u002Fnorthprint",[11],"v-ifとフラグ地獄からの脱出 — Pinia で作る画面遷移ステートマシン","「送信ボタンを2回押されて二重登録」「演出の途中で操作されて画面が壊れる」こういうバグは、たいてい「いま画面がどのフェーズか」をフラグの寄せ集めで持ってるのが原因だと思っています。\nフラグが N 個あれば状態は 2^N 通りになり、バグの元になりやすいです。\n\nこのLTでやるのは、フラグを増やすのをやめて、画面の状態を 「今どこにいるか」1個＋「どこへ行けるか」の道順表 にまとめること。いわゆるステートマシンです（目新しい概念ではなく、昔からある考え方です）。\nこれだけで連打・二重送信・非同期処理中の暴発が解決できることを、自作デモで見せます。defineStore に道順表と、状態を切り替える唯一の関数を置くだけのものです。\n\n回答ボタンの連打や演出中のタイムアップ割り込みを実際に起こし、ステートマシンで弾く様子を見せます。\n持ち帰れるのはウィザード\u002F決済\u002Fアップロードなど 「非同期 ＋ ユーザーがボタンを押す」UI 全般に有用です。\n\nなお、ステートマシンライブラリといえばXStateが定番（公式の@xstate\u002Fvue ）。\n本トークはXStateを入れずPinia直書きで、さらに非同期処理中の意図しない動作を状態の再チェックで消せる方法になります。\n（XState作者自身も「ステートマシンにライブラリは必須ではない」と述べており、本トークはその“ライブラリ無し版”の実演にあたります）。\nhttps:\u002F\u002Fdev.to\u002Fdavidkpiano\u002Fyou-don-t-need-a-library-for-state-machines-k7h\n\n「ならXStateで良いのでは」への答えも用意します、今回話すのは「1フェーズ＋ガード遷移」だけなので、XStateの主役機能（階層・並行状態・アクター・SCXML・visualizer）は使いません。\n状態が階層化・並行化したり、非同期をアクターで宣言的に扱いたくなったらXStateが必要になる、その線引きまで示します。",[561],{"id":562,"avatarUrl":563,"color":40,"socialUrls":564,"name":562,"title":207,"affiliation":568},"northprint","\u002Fimages\u002Favatars\u002Fnorthprint.png",{"x":565,"bluesky":566,"github":567},"https:\u002F\u002Fx.com\u002Fnorthprint","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fnorthprint","https:\u002F\u002Fgithub.com\u002Fnorthprint","株式会社 ICS",{"id":570,"url":571,"type":517,"tracks":572,"start":512,"end":519,"title":573,"overview":574,"speakers":575},"lightning-talk-4","\u002Fspeaker\u002FKoutaro-Hanabusa",[11],"Vite+を爆速で社内のデザインシステムに導入してみた","他の言語では、ツールチェインが最初から統合されているのが当たり前です。Go や Rust では、ビルドもテストもフォーマットも、ひとつの世界の中にまとまっています。一方で JavaScript はテストランナー、リンター、フォーマッター、タスクランナーが別々に存在し、組み合わせるのも保守するのも自分たちの仕事でした。\n\n2026年3月13日に公開された vite+ は、その断片化を解決しようとする統合ツールチェインです。テスト、lint、フォーマット、タスク実行、Node の管理までを vp ひとつに束ねます。\n\n公開されたばかりの、しかもまだα版のこの vite+ を、社内のデザインシステムに爆速で導入しました。α版を本番の資産に入れるのは、普通なら避ける判断です。「α版をもう本番に入れたの？」と思うかもしれません。それでも入れた理由と、入れてみて実際どうだったのかを、このトークで正直に共有します。\n\n移行して良かったところもあれば、まずかったところもありました。どこまで畳めたのか、どこで詰まったのか、そしてなぜα版を本番に入れる判断をしたのか。具体は登壇でお見せします。\n\n参考: https:\u002F\u002Fviteplus.dev\u002F\n",[576],{"id":577,"avatarUrl":578,"color":40,"socialUrls":579,"name":582,"title":207,"affiliation":32},"Koutaro-Hanabusa","\u002Fimages\u002Favatars\u002FKoutaro-Hanabusa.png",{"x":580,"github":581},"https:\u002F\u002Fx.com\u002Fburio_16","https:\u002F\u002Fgithub.com\u002FKoutaro-Hanabusa","ぶりお",{"id":584,"url":585,"type":517,"tracks":586,"start":512,"end":519,"title":587,"overview":588,"speakers":589},"lightning-talk-5","\u002Fspeaker\u002Fhakshu25",[11],"Vite+のちょっとした改善から学ぶ、OSSコントリビューションの始め方","私たちは毎日、Vueを取り巻く多くのOSSに助けられて開発しています。そんな中「OSSに貢献したいけど難しそう」と感じる人は多いはず。\n使っていて気づく利用者の「ここ改善したい」は、実はあなたの手で直せます。\n私はVite+のvp migrateで「なぜこのファイルの移行が必要か情報が少なくて分かりにくい」という1ユーザーの声に、PRで応えました。\n\n本LTではVite+を軸に、StorybookやOxcなど他のOSSへのPRの実例も交えながら、コントリビューション対象の見つけ方と「変更を1つに絞る」「issueを紐づける」「PRの書き方」といったOSSへの小さなPRの作法を紹介します。合わせて、AIエージェント（Claude Code等）に任せる部分と自分が責任を持つ部分の線引きにも触れます。\n\nこれらはAIの活用も含めて普段の業務と変わらず、特別なスキルはいりません。次の誰かのために最初の一歩を踏み出す方法を持ち帰ってください。",[590],{"id":591,"avatarUrl":592,"color":40,"socialUrls":593,"name":596,"title":536,"affiliation":32},"hakshu25","\u002Fimages\u002Favatars\u002Fhakshu25.png",{"x":594,"github":595},"https:\u002F\u002Fx.com\u002Fhakshu25","https:\u002F\u002Fgithub.com\u002Fhakshu25","hakshu",{"id":598,"url":599,"type":517,"tracks":600,"start":512,"end":519,"title":601,"overview":602,"speakers":603},"lightning-talk-6","\u002Fspeaker\u002FEluwing",[11],"外国人エンジニアがVueプロトタイプで仕様を合わせている話","外国人エンジニアとして日本のフロントエンドチームで 9 年働いてきました。仕様確認や進捗共有で、お互い「わかったつもり」になって後からズレが発覚することが何度もありました。日本語が母語でない自分にとって、これは特に大きな壁でした。\n\n最近は AI でプロトタイプを作るハードルが下がり、文章で説明する代わりに、動く Vue コンポーネントを見せて合意を取る場面が増えています。画面共有で実際に触れる形にすると、認識のズレが早く見つかります。具体的なものを見せながら進めること自体が、チームの信頼にもつながっていきました。\n\nこの LT では、Vue \u002F Nuxt の開発で、言葉に頼らず「動くもの」で認識を合わせていく工夫を、外国人エンジニアの視点から共有します。",[604],{"id":605,"avatarUrl":606,"color":40,"socialUrls":607,"name":609,"title":207,"affiliation":421},"Eluwing","\u002Fimages\u002Favatars\u002FEluwing.png",{"github":608},"https:\u002F\u002Fgithub.com\u002FEluwing","ノワン",{"id":611,"url":612,"type":517,"tracks":613,"start":512,"end":519,"title":614,"overview":615,"speakers":616},"lightning-talk-7","\u002Fspeaker\u002Fdrumath2237",[11],"Web3Dライブラリを作ってVue Custom Rendererの仕組みを理解しよう","Custom Rendererは、DOM以外のものをレンダリング（表現）するのためにVueのSFCを使うことができる強力な機能です。\nしかし、公式ドキュメントや有志の記事を含めてあまり情報がなく、学習するのに少し難しい機能にも思えます。\n\n本セッションでは、Web3DライブラリであるBabylon.jsのラッパーライブラリを開発する過程でVueのcustom rendererがどのように使えたのかをご紹介します。",[617],{"id":618,"avatarUrl":619,"color":40,"socialUrls":620,"name":624,"title":264,"affiliation":625},"drumath2237","\u002Fimages\u002Favatars\u002Fdrumath2237.png",{"x":621,"bluesky":622,"github":623},"https:\u002F\u002Fx.com\u002Fninisan_drumath","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fdrumath2237.bsky.social","https:\u002F\u002Fgithub.com\u002Fdrumath2237","にー兄さん","株式会社ホロラボ",{"id":627,"url":628,"type":517,"tracks":629,"start":512,"end":519,"title":630,"overview":631,"speakers":632},"lightning-talk-8","\u002Fspeaker\u002Fryuhei373",[11],"結局Nuxt Layersって何ができて何が嬉しいの？","Nuxt LayersはNuxt 3から導入されている機能ですが、日本語圏では情報が少なく、「モノレポ関連の何か」くらいのイメージで止まっている方が多いと思います。実際私もその一人でしたが、Nuxtのエコシステムには興味がありつつ、Layersには手を出せていなかったので、今回改めて検証しました。\n\nLayersの正体は、Nuxtプロジェクトの構成要素を別ソースからまるごと合成する仕組みです。モノレポ内の機能分離だけでなく、複数サイト間のUI共通化や環境別の機能切替、テーマの差し替えにも使えます。検証で得た具体例とともに、Layersという機能の本質と活用パターンを紹介します。",[633],{"id":634,"avatarUrl":635,"color":40,"socialUrls":636,"name":634,"title":640,"affiliation":641},"ryuhei373","\u002Fimages\u002Favatars\u002Fryuhei373.png",{"x":637,"bluesky":638,"github":639},"https:\u002F\u002Fx.com\u002F373_3","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fryuhei373.dev","https:\u002F\u002Fgithub.com\u002Fryuhei373","エンジニア","株式会社ノーススター",{"id":643,"url":644,"type":517,"tracks":645,"start":512,"end":519,"title":646,"overview":647,"speakers":648},"lightning-talk-9","\u002Fspeaker\u002Fkoki_m",[11],"SFCで実現する病院・医療システムの動的組み立て式UI","病院では、同じ患者を見ていても、医師・看護師・薬剤師・臨床工学技士など職種ごとに必要な情報は異なります。さらに、外来・病棟・ICU・手術室・救急など、診療の場面によっても求められる情報は変化します。本LTでは、画面を小さなVueコンポーネント（ウィジェット）の集合として設計し、利用者自身が自由に配置・保存できる仕組みを紹介します。病院・医療システムならではのUI設計の考え方と、実際に画面を組み替えるデモをお見せします。",[649],{"id":650,"avatarUrl":651,"color":40,"socialUrls":652,"name":654,"title":655,"affiliation":32},"koki_m","\u002Fimages\u002Favatars\u002Fkoki_m.png",{"x":653},"https:\u002F\u002Fx.com\u002Fkoki_m","kouki.miura","医療ITエンジニア",{"id":657,"url":658,"type":517,"tracks":659,"start":512,"end":519,"title":660,"overview":661,"speakers":662},"lightning-talk-10","\u002Fspeaker\u002FCrafterKina",[11],"便利で危険なDeep Reactivityとの付き合い方","VueはProxyを使って、一般的なデータ構造に対するミューテーションに対してリアクティビティを提供しています。\nこれは便利である一方で、defineModelやwritable computed、果てはpropsまでもが、暗黙的なミューテーションによるデータフローの混乱をもたらす源泉となりうる危険な機能でもあります。\n例えば、propsにオブジェクトを渡したとき、その渡された子コンポーネントは誰にも怒られることなくそのオプジェクトをミューテーションすることができます。\nこのLTでは実体験から、Deep Reactiveのよくあるデータフロー混乱パターンを紹介し、どのような回避手段があるかを検討します。",[663],{"id":664,"avatarUrl":665,"color":40,"socialUrls":666,"name":668,"title":669,"affiliation":32},"CrafterKina","\u002Fimages\u002Favatars\u002FCrafterKina.png",{"github":667},"https:\u002F\u002Fgithub.com\u002FCrafterKina","キナ","プログラマ",{"id":671,"type":19,"tracks":672,"start":512,"end":673,"programs":674},"session-16:35-17:05-track4",[12],"17:05",[675],{"id":676,"url":677,"type":19,"tracks":678,"start":512,"end":673,"title":679,"overview":680,"speakers":681},"session-16","\u002Fspeaker\u002Fyut0naga1",[12],"Vue.jsのGitHubから学ぶ意思決定","Vue.jsは10年以上にわたり進化を続けています。その裏側には、数え切れないほどのIssue、Pull Request、RFCでの議論があります。\n\n本セッションでは、vuejs\u002Fvue、vuejs\u002Fcore、vuejs\u002Frfcs に蓄積された約10年分のIssue・PR・RFCをAIで横断的に整理し、Vue.jsがどのような課題に向き合い、どのような意思決定を積み重ねてきたのかを読み解きます。\n\n本セッションでは、コミッターではなく、一人のVueユーザーとしてGitHubに残された公開資料を読み解きます。 リリースノートや公式ドキュメントだけでは見えない議論をたどることで、Composition APIや\u003Cscript setup>といった機能が「なぜその形になったのか」を理解することを目指します。\n\nまた、このセッションで紹介したいのはVue.jsの歴史そのものではありません。GitHubに残された議論を読み解くことで、OSSの設計や意思決定を学ぶという、新しい学び方です。\n\nAIによって膨大な開発履歴を扱えるようになった今だからこそ、OSSは「使うもの」から「学ぶもの」としても活用できると考えています。\n\nVue.jsをより理解したい方、OSSから設計や意思決定を学びたい方に、新しい視点を持ち帰っていただければ幸いです。",[682],{"id":683,"avatarUrl":684,"color":40,"socialUrls":685,"name":688,"title":689,"affiliation":690},"yut0naga1","\u002Fimages\u002Favatars\u002Fyut0naga1.png",{"x":686,"github":687},"https:\u002F\u002Fx.com\u002Fyut0naga1","https:\u002F\u002Fgithub.com\u002Fyut0naga1","永井優斗\u002FYuto NAGAI","シニアコンサルタント","フューチャーアーキテクト株式会社",{"id":692,"type":7,"tracks":693,"start":450,"end":694,"heading":695,"programs":696,"display":697,"isPcOnly":698},"transition-1",[9],"18:00","転換",[],{"startTime":32,"endTime":32,"color":57},true,{"id":700,"type":7,"tracks":701,"start":450,"end":702,"heading":54,"programs":703,"display":704,"isPcOnly":698},"schedule-16:50-16:55-track2",[10],"16:55",[],{"startTime":32,"endTime":32,"color":57},{"id":706,"type":19,"tracks":707,"start":702,"end":708,"programs":709},"session-16:55-17:25-track2",[10],"17:25",[710],{"id":711,"url":712,"type":19,"tracks":713,"start":702,"end":708,"title":68,"overview":32,"speakers":714},"session-17","\u002Fspeaker\u002Fmnmxmx",[10],[715],{"id":716,"avatarUrl":717,"color":40,"attendedIndex":718,"socialUrls":719,"name":722,"title":723,"affiliation":32,"bio":724},"mnmxmx","\u002Fimages\u002Favatars\u002Fmisaki-nakano.png",6,{"x":720,"github":721},"https:\u002F\u002Fx.com\u002Fmisaki_mofujp","https:\u002F\u002Fgithub.com\u002Fmnmxmx","中野 美咲","WebGL Developer","中野美咲は2016年からWebGL開発者として活動しており、企業のブランディングサイト、シミュレーション、データビジュアライゼーションにおけるWebGLの実装を担当。現在はGitHubのブランディングチームに所属。",{"id":726,"type":7,"tracks":727,"start":673,"end":728,"heading":54,"programs":729,"display":730,"isPcOnly":58},"schedule-17:05-17:20-track4",[12],"17:20",[],{"startTime":32,"endTime":32,"color":57},{"id":732,"type":19,"tracks":733,"start":728,"end":519,"programs":734},"session-17:20-17:50-track4",[12],[735],{"id":736,"url":737,"type":19,"tracks":738,"start":728,"end":519,"title":739,"overview":740,"speakers":741},"session-18","\u002Fspeaker\u002Fushironoko",[12],"型なし、テストなし、1万行のドメインロジックがあるVuexをPiniaへ移行する","Studioでは、10年に及ぶ開発で蓄積したVue.jsコードの資産があります。これらはStudioのホットパスを今でも支え続けていますが、新しいコードを追加するたびに古いコード、特にVuexが抱えるドメインロジックがまるで炎症のように痛んでいました。2026年になり、コーディングエージェントが当たり前の時代になっても手をつけられておらず、社歴の長い人ほど手をつけられるものではないという認識になっていました。今回は、入社3ヶ月(当時)の私がこの課題にどう向き合い、完遂したかを話します。Vuex\u002FPiniaに関する話と、コーディングエージェントをうまく使う話、課題に対してのマインドの話を3:4:3くらいの割合で話します。マイグレーション後に行った、さらに広範囲のモジュール依存やドメインモデリング改善へPinia化がどう好影響をもたらしたかについても触れます。",[742],{"id":743,"avatarUrl":744,"color":40,"socialUrls":745,"name":743,"title":207,"affiliation":749},"ushironoko","\u002Fimages\u002Favatars\u002Fushironoko.png",{"x":746,"bluesky":747,"github":748},"https:\u002F\u002Fx.com\u002Fushiro_noko","https:\u002F\u002Fbsky.app\u002Fprofile\u002Fushironoko.work","https:\u002F\u002Fgithub.com\u002Fushironoko","Studio株式会社",{"id":751,"type":7,"tracks":752,"start":708,"end":694,"heading":695,"programs":753,"display":754,"isPcOnly":698},"transition-2",[10],[],{"startTime":32,"endTime":32,"color":57},{"id":756,"type":7,"tracks":757,"start":519,"end":758,"heading":759,"programs":760,"display":761},"close",[11,12],"19:30","CLOSE",[],{"startTime":32,"endTime":32,"color":762},"grey",{"id":764,"type":7,"tracks":765,"start":694,"end":758,"heading":766,"programs":767},"after-party",[9,10],"アフターパーティー\nsupported by リンクアンドモチベーション",[],1785765564399]