フロントエンドの基本構造の見直し

[Genbuchan]

😱 発生している問題

• フロントエンドの更新とデータ更新のタイミングが一致しない
• タイミングずれがユーザーに最新の情報を伝える時間の遅さにつながる
• JavaScriptが無効になっている環境で閲覧ができない
• 本質となる情報が静的にマークアップされておらず、機械判読性とアーカイブ性が低い

✨ 新機能・改善内容

ケース1. データ処理から反映までのフローを直列化する

• データの処理が完了次第、そのままフロントエンドの更新処理に入る

ケース2. Nuxt.jsベースのフロントエンドから、静的HTMLベースの設計に変更する

• クローラー、スクラップ管理ツール等、人間ではないユーザーが静的に機械判読できるようにする
• 処理したデータを静的なHTMLファイルに変換する仕組みを用意する
• JavaScriptの有無によりインターフェースを変更してでも、必ず同じ情報にアクセスできるようにする

ケース3. JavaScriptの有無をリスク許容として扱う

• 現行のNuxt.jsのフロントエンドの設計の見直し程度に留め、開発コストを下げる
• Mozilla Firefox、Google Chrome、Microsoft Edge等のシェアが大きいブラウザはデフォルトの設定で当サイトを閲覧可能である

💬 コメント・意見

ケース1の改善内容はどう考えてもメリットが大きいので作業内容に含めるべきだと思いますが、ケース2とケース3の相反性は意見が分かれるポイントだと思っています。

結論から言うと、私としてはケース2のプランを支持します。

まず、ブラウザ上で動くJavaScriptの実行環境は、その性質上ブラウザに任意のコードを実行させることになります。

かつてNetscapeやInternet Explorer等のレガシーブラウザでは、前述の性質もあってかJavaScriptの有効・無効の切り替えが容易に可能であり、またスクリプトを実行するかどうかユーザーに確認する時代でもありました。

現在のウェブブラウジングのUXは、HTML / CSS / JavaScript等のWebサイトを構成するファイル群をダウンロードするという感覚を知覚させにくいものであり、しばしば「読み込む」などと表現されることがあります。故に、リンクをクリックしたらサイトを構成するデータが自動ダウンロードされ、JavaScriptのコードが自動実行されているんだ、という感覚は、なかなかユーザーが知覚しにくい部分でもあります。

これを踏まえた上で、訪問先のサイトが信用できるかどうか、それはユーザーにとって見解が分かれるポイントになるでしょう。訪問先のサイトがスパイウェアやマルウェアに該当するコードを、ブラウザに実行させる可能性も考えられます。しかし、現在の主要なブラウザは原則JavaScriptをデフォルトで有効化しているため、これらのコードが訪問するだけで実行されてしまうという問題があります。

その対策としてJavaScriptの自動実行を無効化し、ブラウジング環境の安全性を担保しながら情報収集を行いたいユーザーのために、JavaScriptが要らないサイト作りは重要となるでしょう。

しかし、JavaScriptを使わないサイト作りにも問題があります。それは、HTML / CSSだけでは実現できない高度なインターフェースを活用した利便性向上が行えなくなる、という問題です。現時点で当サイトにはグラフや陽性者の属性などでその機能を活用しており、このままJavaScriptを無効化すると、重要な手段を提供する手段を失ってしまうかもしれません。

そこで、以下のアイデアを提案します。

• JavaScriptを無効化した環境で閲覧する際、膨大な情報はHTMLファイルを分割する形態や、詳細ごとにページを作り、ハイパーリンクを貼るようにする。これにより、提供している目的の情報に必ずたどり着けるようにする。
• JavaScriptを有効化した環境で閲覧する際、ページビューや詳細のポップアップ表示等で、目的の情報のアクセスの即時性を高めるようにする

私自身、インターネットで取り交わされる情報のあり方を常日頃考えている立場として、また当チームのリーダーとして、これらの提案と実装の両方に責任を持つことを改めて表明いたします。

以上のアイデアの方、ぜひご検討ください。もし他にご意見やご質問がございましたら、遠慮なくお申し付けください。