WEBサイト制作時に活用したい！有名サービスの挑戦的な技術3選

こんにちは。PIVOTコラム編集部です。
今回は、普段みなさんも使っているであろう有名なサービスにおいて採用されている面白く挑戦的な技術を３つ紹介します。エンジニアではない方でもなんとなく理解していただけるように、噛み砕いて説明します。

※ご留意事項：私の好みが大いに含まれていること、技術自体の細かい説明は省くこと、デメリットをかなり度外視している点に注意した上で、「こんな技術があるんだな」程度にとらえて頂けると幸いです。

Figmaはデザインツールとして有名ですが、内部ではWebAssembly(以下WASM:ワズム)を採用しています。（WebAssemblyって何？という方はこちらの記事をご参照ください）

WASMとは、コンピューターが理解しやすいアセンブリ“風”言語です。コンピュータが理解しやすい形であることから高速に動作することが期待でき、名前にWebとついている通り、最近のブラウザであればWASMがサポートされつつあります。また、WEB(ブラウザ)以外でもWASMは動かすことが可能で、近年注目を集めています。

現在WEBで処理を行う際、JavaScriptを用いることがデファクトスタンダードになっていますが、WASMは重い処理だけを請負ってJavaScriptを補完して動作することが可能です。

以下の参考記事では、WASMを採用したことでFigmaの読み込み時間を1/3にしたという内容が記載されています。新しい技術であることから問題点がまだあることを挙げつつも、WEBの未来を感じるものとなっています。
参考記事 : https://www.figma.com/blog/webassembly-cut-figmas-load-time-by-3x/

Rakuten(楽天)のベルリン支店では、JavaScriptで書かれたコードがスパゲッティ(入り組んだ)状態になってしまうため、１箇所を修正すると他の箇所が壊れてしまう等の問題が発生し、システム保守において問題を抱えていました。この悪夢のような状態を解決するために、Elm(エルム)という純粋関数型プログラミング言語を採用しました。

Elmは、2019年にわざわざ学ばなくてもいいプログラミング言語ランキングで堂々の一位になってしまったことで話題に上がりました。確かに、Elmを学ぶことはWEBサイト開発において必要条件ではありませんが、Elmを採用することで実行時にエラーが発生しない堅牢なアプリ開発が可能になります。 元の記事においても言語の有用性・価値を批判するものではないと紹介されています。

また、Elm利用者はElmへの愛が強い傾向があり、参考記事においてもElm愛を存分に語っています。ちなみに、私も好きでよく使っている言語です。
参考記事：https://engineering.rakuten.today/post/elm-at-rakuten/

音楽サービスのSpotifyではMicro Frontends(マイクロフロントエンド)を採用しています。 マイクロフロントエンドは、マイクロサービスをフロントエンドにも広げることで 巨大化した組織内でも開発効率を落とす事なく運用することが可能になります。

極端な例を上げるなら、WEBサイトのヘッダー部分をVue.jsで、フッター部分をReactで書き、メインの部分を素のJavaScriptで書くといった事が可能になります。

コンポーネント単位・ページ単位の結合を緩くして開発することで、 チームを分解できスピードを損なわない柔軟な技術選定を実現します。チームごとに使うフレームワークやCCSの命名規則が異なっていても、互いに影響しないようにします。
参考記事 : https://www.slideshare.net/kevingoldsmith/how-spotify-builds-products-organization-architecture-autonomy-accountability

技術は、その時代の人間の生き方によって変化していきます。 現代では、大規模で複雑なアプリケーションが増えているので、それに耐えうる技術が開発されています。 数十年後にARデバイスが普及し、大きい映像データをストリーミングできる強固なネットワークが必要になるかもしれません。

私達エンジニアは、技術を享受する側面が強く、「技術が開発された経緯・目的」を忘れがちですが、その時に適切なモノを選択出来るようにあるべきだと思います。そのためにも、技術開発者への敬意も忘れずに、日々情報のキャッチアップを続けていきたいです。

この記事が誰かのアンテナに引っかかり、少しでも興味を持っていただけたら嬉しく思います。