オープンソースのjQueryライブラリはWeb開発の現場において何年もの間不動の地位についていました。

JavaScriptのことを深く理解していなくとも、オブジェクト指向で分かりやすい構文、豊富な外部プラグイン、加えてAjaxなどの非同期通信も簡単に扱うことができたのが、その人気の理由です。

JavaScriptを用いた開発現場ではいまもなお人気のjQueryですが、ここに来て新たなJavaScriptライブラリが注目を集めています。

それが、Umbrellaです。

UmbrellaはjQueryと同様に完全オープンソースで、jQueryと同じく要素セレクタを扱うことができたり、DOM操作ができたり、Ajaxリクエストを行うことができます。

また、UmbrellaはjQueryと若干異なる文法や関数の呼び出し方を採用していますが、基本的に残りの部分はほとんどjQueryと一緒です。

それでは、これだけjQueryが普及しているにもかかわらず、あえてUmbrellaを使う理由はどこにあるのでしょうか。

今回は、今注目のJavaScriptライブラリである「Umbrella」について詳しく解説していきます。

jQueryについて復習したい方は、以下の記事も参考にしてみてください。

参考：

ノンデザイナーのためのjQuery入門

Umbrellaとは？

Umbrellaはオープンソースの超軽量なJavaScriptライブラリです。

使い方がjQueryと極めて似ているため、学習コストが少なく、すぐに導入できる点が、今注目を集めている理由です。

2006年に最初のバージョンがリリースされて以来、jQueryは今日のWeb開発を支える上で重要な役割を担ってきました。

しかし、10年以上経過した上で機能の見直しや文法の効率性の見直しがあり、そこで登場したJavaScriptライブラリのひとつが、Umbrellaなのです。

Umbrellaの特徴

それでは、jQueryと比べて、Umbrellaにはどのような特徴があるのでしょうか。

1. 超軽量

多くのフロントエンドエンジニアが口を揃えて言うのが、「Umbrellaは超軽量」ということです。

jQueryライブラリは全て読み込むと250KBかかりますが、Umbrellaは圧縮していないコードでもたったの4KBです。

もちろんページの読み込みスピードはGoogleのページ評価にも影響するので、軽量であるということは意味のあることです。

2. 学習コストが少ない

UmbrellaはjQueryから大きく影響を受けています。

jQueryの文法を知っているのであれば、簡単にUmbrellaを導入することができます。具体的には「$('要素')」という書き方を「u('要素')」に変えればいいだけです。

また、クリックやホバーといったイベントハンドラーもそのまま扱うことができます。

3. 必要十分な機能

UmbrellaはもともとjQueryの中でも特に頻繁に使われるDOM操作に特化して開発されたという経緯があります。

UmbrellaはDOM操作、イベント、AjaxなどのjQueryでも使える機能的な側面は残しつつ、他のライブラリでも代用できるようなアニメーション機能などはカットすることで、軽量かつ扱いやすいライブラリに仕上がっています。

4. もちろん無料

MITライセンスでGithub上で公開されており、無料で導入することができます。

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

プラグイン プラグインは、本来あるソフトウェアに機能を拡張させるために追加するプログラムのことです。 このページではWordpressのプラグインを例としてお話していきます。 もっと詳しく見る

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

JavaScript JavaScript（ジャバスクリプト）とは、Webサイト上でさまざまなインタラクティブな動きを実現するために用いられる言語 もっと詳しく見る

ページ 印刷物のカタログやパンフレットは、通常複数のページから成り立っています。インターネットのホームページもまったく同じで、テーマや内容ごとにそれぞれの画面が作られています。この画面のことを、インターネットでも「ページ」と呼んでいます。ホームページは、多くの場合、複数ページから成り立っています。 もっと詳しく見る