no-image

JavaScript

jQueryの代わりに使用できるマイクロJavaScriptライブラリ「Selector」

Selectorは、jQueryの代わりに使用することができるマイクロJavaScriptライブラリです。ほぼ5KBの重さでjQueryと比較すると非常に軽量なものとなります。本JSライブラリの目的は、jQueryを置き換えるために使用できるライブラリを構築することです。

具体的には、ライブラリのファイルサイズを縮小し、縮小されたzipファイルを5KB未満に抑え、同時にjQuery機能のサポートも行うというものです。本ライブラリの使用による最大の効果は、圧縮下でjQueryよりも高速に動作する最新のライブラリをサイトに構築することが可能になることです。そして、サイトの軽量化が期待できますので、ユーザーのより快適なサイト閲覧をサポートすることができるでしょう。

それでは、Selectorについて詳しく見ていきましょう。

Selector

デモ

Selector は5KB未満のサイズで、jQueryを置き換えるために使用されるJSライブラリですが、実際どれくらいの軽量なのでしょうか。プラグインの配布サイトにサイズの比較が紹介されていました。

※( )内は、Selectorに対する比較。

  • Selector ・・・ 68KB
  • jQuery3.2 ・・・271KB(+203)
  • jQuery3.2Slim ・・・217KB(+149)
  • Selector ・・・ 16KB
  • jQuery3.2 ・・・84.5KB(+68.5)
  • jQuery3.2Slim ・・・68KB(+52)
  • Selector ・・・ 4.8KB
  • jQuery3.2 ・・・28.6KB(23.8)
  • jQuery3.2Slim ・・・22.7KB(17.9)

ご覧の通りどの場合でも明らかにSelectorの方が軽量であることが分かりますね。

近年のWEBサイトのデザインを含むトレンドは、まさに日進月歩で高度な技術や洗練されたコンテンツを有しています。そして、そのほとんどのサイトがjQueryを使用しており、様々なプラグインを併用して構築されています。そのため、コンテンツの表示までに時間がかかるサイトも珍しくはありませせん。

表示までの待ち時間を「%」を使用して知らせるサイトもあります。このような場合に、jQueryを軽量なサイズで置き換える本ライブラリの活躍は期待できますね。劇的な変化が無いとしても、クリエイターにとってサイトの軽量化は永遠のテーマであるように思います。

「ユーザーを待たせない」ということは、ユーザビリティの基本と言っても良いのではないでしょうか。ぜひSelectorをお役立てください。

Selector

関連記事

  1. notifier

    JavaScript

    Webサイトにシンプルな通知を表示させるjQueryプラグイン「notifier」

    notifierはWebサイトにシンプルな通知を表示させることができる…

  2. gridslide.js

    JavaScript

    いろんな方向に画像をスライドできるjQueryイメージスライダー「gridslide.js」

    gridslide.jsはいろんな方向に画像をスライドさせることができ…

  3. flubber

    JavaScript

    滑らかなシェイプアニメーションを実装できる「flubber」

    flubberは、滑らかな2Dによるシェイプアニメーションを実装するこ…

  4. JavaScript

    レスポンシブに対応して画像をポップアップ表示してくれる素敵なjQueryプラグイン「fancyBox…

    とても有名なプラグインですが、今まで使ってみたことがなかったので試して…

  5. ClickSpark.js

    JavaScript

    美しいパーティクルエフェクトを実装できる「ClickSpark.js」

    ClickSpark.jsは画像を用いたたくさんの粒子が放出されるよう…

  6. Lena.js

    JavaScript

    多彩な画像処理ができるJSライブラリ「Lena.js」

    Lena.jsは多彩な画像処理を行うことができるJSライブラリです。セ…

最近の記事

  1. 簡易アクセス
  2. SOUNDLINK MINI II Special Edition
  3. メリーストロベリーケーキフラペチーノ

アーカイブ

PAGE TOP