diff --git a/app/routes/posts/browser-back-forward-reason.mdx b/app/routes/posts/browser-back-forward-reason.mdx new file mode 100644 index 0000000..06953e1 --- /dev/null +++ b/app/routes/posts/browser-back-forward-reason.mdx @@ -0,0 +1,76 @@ +--- +title: "ブラウザバック/ブラウザフォワードはなぜ存在するのかを考えてみる" +description: "この記事では、そもそもなぜブラウザバック/ブラウザフォワード(以降BFと呼びます)が存在するのか見ていきたいと思います。" +date: "2024/12/08" +updatedAt: "2024/12/08" +path: "browser-back-forward-reason" +published: true +--- + +[2024年 ユウトの一人アドベントカレンダー](https://adventar.org/calendars/9980)の8日目の記事です。 + +## Intro + +この記事では、そもそもなぜブラウザバック/ブラウザフォワード(以降BFと呼びます)が存在するのか見ていきたいと思います。 + +## BFはいつから存在するのか + +筆者はそこまで過去のことを語れるほどブラウザの歴史についての知見があるわけではなく、記事から得た情報を元に、この見出しを書いています。 + +今のブラウザの元となった、[NCSA Mosaic](https://ja.wikipedia.org/wiki/NCSA_Mosaic)の説明書の一つとして、[Basic Hypertext Navigation with NCSA's Mosaic](https://www.uoxray.uoregon.edu/local/manuals/biosym/discovery/Html_Help/navigating.html?utm_source=chatgpt.com)というものが存在します。 + +そしてこの中に + +> - Back to return to the most recently viewed page (that is, up in the Mosaic history file) +> - Forward (when available) to go down in the Mosaic history file + +の二つが存在しています。 +そのため、おそらくBFの機能は後からではなく、かなり初期の時点であったのではないでしょうか。 + +## BFが存在しない世界線 + +では次は逆に、BFが存在しないブラウザを考えてみましょう。 + +BFがあることで、我々ブラウザを使用するユーザーは、リンクを踏んで、見たいものではなかったら戻る(ブラウザバック)ことができ、 +もう一度確認したいときは再度進む(ブラウザフォワード)することができます。 + +これらがないということは、ユーザーがページを移動する方法は、再度リンクを踏むか、URLを打つということしかできなくなります。 +もし閲覧機能が実装されていれば、過去閲覧したものから見たいページを探してクリックして開く。みたいなこともできるかもしれません。 + +整理すると以下のようになる想定です。 + +1. ページ遷移先で以前見ていたページのリンクをクリックする +2. 検索する +3. 過去閲覧したものから見たいページを探して開く + +現状のブラウザの機能を踏まえると、このような遷移方法になるのではないでしょうか。 + +そして1はまず無理であることはなんとなく想像が着くかと思います。 +なぜなら今筆者が書いているような個人ブログでは、引用した公式ドキュメントのリンクを貼ることが多いです。 +しかしその遷移先で、このブログのリンクが貼られている。ということはとてもじゃないですが考えられないです。 + +それに比べると、まだ2は可能性はある気がします。 +しかし、エンジニアやPCの扱いに慣れている人なら、一度打ったURLからなんとなく以前のページにたどれるかもしれません。しかし、まだPCに慣れていない人などにとっては高い障壁と言え、ブラウザを使用するハードルが高くなっていたかもしれません。 + +それなら、3はどうでしょうか。 +筆者としては、この中なら3をうまく使う気がします。 + +しかし、一つ前のページを見るためにわざわざ閲覧履歴ページという新しいページを開くのは、まだUXがいいとは言えない気がします。 + +## もしブラウザバックがなかったら、リンクは全てtarget=_blankに + +筆者がもし実装するエンジニアなら、ブラウザバックがないのであれば、ほぼ全てのリンクにtarget=blankを設定します。 + +そうすることで、今開いているページはそのままで、新しいページと行き来することが可能になるので、そこそこのUXが提供できるでしょう。 + +しかしこれもこれで、大量のタブが生まれることになり、管理が面倒になるのは容易に想像できます。 + +## さらなるUXを求めて。 + +このように、BFがなければ…と考えていくと、ブラウザのUXのために重要な機能であることが理解できました。 + +しかし現代のブラウザは、単に「戻る」「進む」だけに留まりません。 +ユーザー体験をさらに向上させるため、ページ全体を記憶し、瞬時に復元する技術を導入しています。それが「bfcache(Back/Forward Cache)」です。 +bfcacheは、従来のページ再読み込みを不要にし、瞬時にページを復元することで、モバイル端末でも快適なブラウジング体験を提供します。 + +次の記事では、bfcacheについて書いていこうと思っています。 \ No newline at end of file