Oyama Michinoku yamanoku

Navigation APIの潜在的ユースケースとユーザランド普及に向けた戦略的アプローチ

導入：Webアプリケーションにおけるナビゲーションの歴史的変遷とNavigation APIの登場

Webアプリケーションのアーキテクチャは、過去十数年にわたりマルチページアプリケーション（MPA）からシングルページアプリケーション（SPA）へと劇的なパラダイムシフトを遂げてきた。この進化の過程で、クライアントサイドルーティングはSPAの根幹をなす技術として発展したが、その基盤は長らくHTML5で導入されたHistory API（history.pushState、history.replaceState、およびpopstateイベント）に依存してきた1。しかしながら、History APIは本来SPAの複雑なステート管理やルーティング要件を想定して設計されたものではなく、クロスドキュメントナビゲーションの延長線上に後付けされた機能群に過ぎなかった3。その結果、開発者は「ブラウザの戻る・進むボタンの監視におけるpopstateイベントの不整合（プログラムからの呼び出し時に発火しない問題）」「セッション履歴の完全なスタックの把握の不可能性」「クロスオリジン遷移と同一ドキュメント遷移の判別の困難さ」「非アクティブな履歴エントリの編集不可」といった数多くの技術的制約とエッジケースに直面し続けてきた1。

これらの技術的負債を根本から解消し、SPAの要件に特化したネイティブなプラットフォーム機能を提供するためにWICG（Web Incubator Community Group）によって策定されたのが「Navigation API」である3。旧称「App History API」として開発が開始されたこの仕様は3、2026年初頭にはすべての主要なブラウザでサポートされ、「Baseline 2026（新たに利用可能）」のステータスを獲得するに至った1。Navigation APIは、ナビゲーションの開始、インターセプト、およびブラウザのナビゲーションアクションの管理を一元化し、アプリケーションの履歴エントリを直接調査・操作する包括的な能力を提供する4。

現在、フロントエンドコミュニティにおけるNavigation APIの主な恩恵は、React RouterやVue Routerといった既存の各種ルー

新しいWeb History APIの提言

広く利用されている History API は、最も基本的なユースケースにおいてさえ利用が困難です。このことは、カスタムビルドのWebアプリケーションや共有コンポーネントライブラリにとって障害となっています。

History APIの使用を必要とする主要なユースケースには、以下のようなものがあります。

シングルページアプリケーション（SPA）向けのWebアプリルーター: クライアントサイドルーターはナビゲーションを捕捉し、必要な読み込みとレンダリングを同じウィンドウ内で実行し、最終的にアドレスバーのURLと履歴スタックを更新します。
ポップアップやダイアログなどのUIオーバーレイコンポーネント: 通常、意味のあるアドレスバーの変更は伴いませんが、オーバーレイは「戻る」ボタンを使用してキャンセル可能である必要があります。例えば、リッチな日付選択ポップアップでユーザーが「戻る」ボタンをクリックした際、ポップアップが閉じるのではなく、ブラウザが前のページに戻ってしまうのは悪いUX（ユーザー体験）です。
一時的な history.state: bfcache（バック・フォワード・キャッシュ）からの高速なリロードを行うための有用なストレージとなり得ます。
昔ながらの <a href="#..."> によるフラグメントナビゲーション。

成熟から次なるフロンティアへ：Vue Fes Japanのテーマ変遷に関する分析的レビューと2025年の展望

序論

Vue Fes Japanは、日本最大級のVue.jsカンファレンスとして、国内のみならず世界のVue.jsエコシステムの動向を測る重要な指標としての地位を確立している[^1]。Vue.js Japan User Groupによって運営されるこのイベントは、単なる技術発表の場に留まらず、フレームワークの進化、コミュニティの関心事、そして未来の方向性を映し出す鏡の役割を果たしてきた[^3]。本レポートの目的は、2018年の初回開催から現在に至るまでのVue Fes Japanにおける発表内容を網羅的に調査し、そのテーマ選定の根底にある動向を明らかにすることにある。さらに、この歴史的分析と、Vue、Nuxt、Viteの公式ロードマップや最新動向に関する情報を統合し、2025年に開催が予定されている次期カンファレンスで採択される可能性の高い技術テーマを、データに基づき予測・分析する。

本分析は、公式ウェブサイト、過去のタイムテーブル、コミュニティによる参加レポート、そして関連技術の公式発表など、多角的な情報源を基に行われる[^4]。これにより、カンファレンスの過去の軌跡を解き明かし、未来の技術的展望を提示することで、Vue.jsエコシステムに関わる全ての開発者、技術リーダー、そしてコミュニティ貢献者にとって有益な洞察を提供することを目指す。

第1章 Vue Fes Japanのテーマ変遷（2018年～2023年）：歴史的分析

なぜ人々はポップアップUIに頼ってしまうのか？

頼ってしまう理由とその背景を考える

Web企業やサービスプロバイダーは、ポップアップUIを利用して宣伝や告知を行うことが多いです。なぜなら、ポップアップは目立ちやすく、即座にユーザーの注意を引くからです。しかし、一部のユーザーにとってはポップアップは迷惑なものと感じることもあります。その理由を考えると、以下のような要素が挙げられます。

目立ちすぎる: ポップアップはユーザーに対して画面上で最も目立つ位置に表示されるため、ユーザーが求めている情報の妨げになることがあります。
中断感: ポップアップが表示されると、ユーザーの行動が一時的に中断されることになります。これはユーザーエクスペリエンスに悪影響を及ぼす可能性があります。
頻度: 一部のWebサイトはポップアップを頻繁に表示し、ユーザーの閲覧体験を妨げることがあります。これはポップアップへのユーザーの反応を悪化させる可能性があります。

altテキストとは？

代替テキスト（略してaltテキスト）とは、ウェブサイトやソーシャルメディアで画像を公開する際に、画像を説明するために使用できるテキストのことです。

なぜaltテキストが重要なのでしょうか？

ブラウザが画像を表示しなくなったと想像してみてください。それでも、記事の中で画像が参照されているのを見たり、画像についての会話を読んだり、人々がジョークを言っているのを読んだりするでしょう。この経験はあなたにとってどのようなものだろうか？かなり取り残された気分になるだろう。

これが、目の見えない人や視覚障害者にとっての現実なのです。しかし、状況は良くなっている！

アクセシビリティ

Radix Primitives は、ARIA Authoring Practices Guide に従い、幅広い種類のモダンブラウザやよく使用されている支援技術によってテストされています。

私たちは、アクセシビリティに関連する多くの実装上の詳細、aria 属性や role 属性、フォーカス管理、キーボードナビゲーションなどを扱っています。これにより、ユーザーは多くのコンテキストで私たちのコンポーネントをそのまま使用し、期待されるアクセシビリティデザインパターンに従う機能性に依存できるようになります。

WAI-ARIA

WAI-ARIAは、W3C によって発表・メンテナンスされており、Radix Primitives で表示される多数の一般的な UI パターンのセマンティクスを規定しています。これは、ブラウザーに提供される要素を使用せずに構築されたコントロールに意味を与えるために設計されています。たとえば、button を作成するために div を使用する場合、div がスクリーンリーダーや音声認識ツールにとってボタンであることを伝えるために追加する必要がある属性があります。

2022ベスト・オブ・ツイートノミネート作品二次選考

2022ベスト・オブ・ツイートノミネート作品一次選考

	// mcp-baseline-server.ts
	import { McpServer } from "npm:@modelcontextprotocol/sdk/server/mcp.js";
	import { StdioServerTransport } from "npm:@modelcontextprotocol/sdk/server/stdio.js";
	import { z } from "npm:zod@^3.24.2";
	import process from "node:process";
	import type { WebFeature, WebFeatureResponse } from "./types.ts";

	const APIURL = "https://api.webstatus.dev/v1/features";

	// Baselineのカテゴリを判定する関数