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. Philter

    JavaScript

    CSSのフィルターをコントロールできるjQueryプラグイン「Philter」

    PhilterはCSSのフィルターを簡単にコントロールすることができる…

  2. SuperEmbed.js

    JavaScript

    さまざまな埋め込み動画をレスポンシブで表示できる「SuperEmbed.js」

    SuperEmbed.jsは、さまざまな埋め込み型の動画をレスポンシブ…

  3. DropDownMenu

    JavaScript

    レスポンシブ対応で多階層なドロップダウンメニューを実装できる「DropDownMenu」

    DropDownMenuは、レスポンシブに対応した多階層なドロップダウ…

  4. JavaScript

    シンプルでカスタマイズも簡単にできるjQueryプラグイン「Twitter Follow Box W…

    とてもシンプルでカスタマイズもしやすいjQueryプラグイン「Twit…

  5. AJAX Live Search
  6. TypeIt

    JavaScript

    タイピングアニメーションを実装できる「TypeIt」

    TypeItはタイピングアニメーションを実装できるjQueryプラグイ…

最近の記事

  1. 久保田城
  2. ハードサイド CS80
  3. ACC-TRBX
  4. ピスタチオ クリスマス ツリー フラペチーノ

Instagram始めました

Facebookページ

PAGE TOP