最速最軽量のJavaScriptフレームワーク「Vanilla JS」を使ってみよう！ ｜ SiTest (サイテスト) ブログ

こんにちは、プロダクト開発チームの牧です。

皆様はJavaScriptのフレームワークに何を使われているでしょうか？
よく名前を聞くやライブラリやフレームワークとしてはjQueryやAngularJS、Vue.js、Reactなどがあり、これら以外にも様々なライブラリやフレームワークが開発されています。
そこで今回は、最速かつ最軽量のJavaScriptフレームワークであるVanilla JSをご紹介します。

Vanilla JSとは、高速で軽量なクロスプラットフォームフレームワークです。
Google やFacebook 、Wikipedia など世界有数の大手サイトでも必ずと言っていいほど使われています。

まずは、公式サイトから必要なものにチェックを入れダウンロードしましょう。

ダウンロードしたJavaScriptファイルの中身を見てみましょう。
とてもスッキリしていて気持ちいいですね。

普通のフレームワークならば下記のようにスクリプトタグで読み込む必要がありますが、Vanilla JSではその必要がありません。

<script src="path/to/vanilla.js"></script>

それでは早速使ってみましょう！

// IDの付いた要素を取得
var element = document.getElementById("ID");

// p要素をbody内に挿入
var p = document.createElmenet("p");
p.innerText = "Hello World!";
document.body.appendChild(p);

ここまで読まれた方は既にお気づきかと思いますが、
Vanilla JSはネイティブのJavaScript APIそのものです。
ライブラリやフレームワークの進化だけでなく、
JavaScriptそのものもまた進化しています。

jQueryや各種フレームワークはとても便利ですが、
その分パフォーマンスを犠牲にしている部分が存在しています。
もちろん、クロスプラットフォームの差異を吸収してくれるため必要な場合は多々ありますが、本当にパフォーマンス重視な部分ではネイティブのJavaScript APIをそのまま書くことが一番なのです。

技術選定において、プレーンにJavaScriptを書くということは
十分選択肢の一つとなりえます。
ライブラリやフレームワークが溢れている今だからこそ、
この記事を読んでほんとうに必要なものは何かを考えていただければ幸いです。