HackerNewsやProductHuntなどで今年話題になったjsライブラリ/フレームワーク一覧です。
備忘録として個人でまとめていましたが、けっこう使えそうなものもあったので、Qiitaにまとめてみました。
＊vue.jsのようなメジャーなものは省いています。
・Metricsgraphics.js
D3の時間軸を必要とするグラフだけに特化したjsライブラリ
D3って色々できるけど実際そんなに使いこなせてない人はこっちの方がいいかも！
・intro.js
ささたつさんの記事でおなじみのサイト上で動作するチュートリアルを簡単につくることが出来るライブラリ
・Seriously.js
リアルタイムでのWeb用ビデオのコンポジター。
After EffectsやNukeを参考に作られ、高品質なエフェクトを適用できるだけでなく、映像をよりダイナミックに、そしてインタラクティブなものにすることに特化している。
・impress.js
Preziのようなアニメーションを組めるフレームワーク
・mailcheck.js
メールフォーム上でのアドレスなどのスペルミスを減らしてくれるライブラリ
ユーザの登録フォームにいれておけば、かなり使えるかも。
・sipn.js
ローディング中のアイコンのアニメーションを自由に組めるライブラリ
複数の種類使う時がそんなに想像できないが・・・w
・two.js
二次元のアイコンやイラストをsvg, canvas, and webglで描写してくれるライブラリ
・fartscroll.js
スクロールする度にオナラの音がでる愉快なライブラリ
これサイトに入れておけばブーブークッション的な事ができそうですねw
・list.js
既存のHTMLに検索やソート、フィルター、テーブル、リストなどを組み込めるライブラリ
・p5.js
簡単にWeb上でイラストや図形を描画できるライブラリ
・oboe.js
JSONをストリーミングで読み込んでくれるライブラリ
・rainyday.js
窓越しに見る雨のアニメーションを適用することができるライブラリ
外は晴れ。でも、気持ちは雨。そんな日にぜひ！
・Walkway.js
SVGイメージを簡単にアニメーション化してくれるライブラリ
・C3.js
D3ベースのチャートを簡単につくってくれるライブラリ
Metricsgraphics.jsと同じくD3を使いこなせてない人にはこういう特化系のライブラリの方がいいですね。そういえば昔はchart.jsってやつ使ってたな・・・
・PathFinding.js
スタート地点からゴール地点までのルートをシミュレーションしてくれるライブラリ
ゲームを作るときには使えそう。
・Alertify.js
アラート画面のデザインをカスタマイズできるライブラリ
ブラウザが提供している簡素なアラートよりはこっちの方が良さそうですね。
・Reveal.js
HTMLでのカッコいいプレゼンテーションを簡単に作れるライブラリ
3Dアニメーションが特徴的。
・Gmaps.js
Google Mapsの各機能の表示をカスタマイズできるライブラリ
・Ractive.js
テンプレートドリブンなUIライブラリ
Angularとかと書き方は似ている。テンプレートドリブンなところが違うんですかね。
・Headroom.js
ヘッダーが消える/表示されるタイミングをスクロールダウン/アップのアクションに合わせて自由にカスタマイズできるライブラリ
ヘッダーをずっとは表示させたくない！けど、スクロールするとすぐ消えるのも嫌！といったこだわりの強い方におすすめ。
・Drawingboard.js
Web上にお絵描き機能を実装してくれるライブラリ
・Nightwatch.js
フロントサイドの挙動のテストをしてくれるライブラリ
・Turn.js
本のページをめくるアニメーションを実装してくれるライブラリ
電子書籍やドキュメントをちょっとお洒落に読みたい！なんて方にはおすすめです。
・garlic.js
フォーム入力データをローカルストレージに保存し、再読み込みしても復元してくれるライブラリ
フォームに入力している際にうっかりページを閉じていしまったりした際に入力してたデータが消えた！なんてことを防ぎます。
・Riot.js
Javascriptのクライアントサイト軽量MVP(Model-View-Presenter)フレームワーク
どれくらい軽量かというと、なんと約1kbだとか。
・Chardin.js
シンプルなインストラクチャー（サイト上のボタンや機能の説明など）を実装できるライブラリ
・Infinity.js
長いリストやテーブルをスクロールする際に、スピードアップをしてくれる機能を実装してくれるライブラリ
Airbnbでも実装されているそうです。
・Vim.js
VimをWeb上で再現してくれるライブラリ
・Arbor.js
マウスやクリックの動きによってアニメーションが動くインタラクティブなグラフを実装してくれるライブラリ
・popcorn.js
HTML5 videoにイベントを発生させるようにするライブラリ
再生位置が10秒になったらアラートをだすみたいなことが出来るそうです。
・Immutable.js
Immutableなデータを生成してくれるライブラリ
・Vis.js
データをビジュアル化することに特化しています。
ネットワーク図をはじめ、データ同士のつながりを表現するのに向いたライブラリです。
・Creditcard.js
カード決済のフォームを簡単に実装できるライブラリ
・Ampersand.js
高いモジュール性を兼ね備えたフレームワークらしくない新しいフレームワーク。。。だそうです。
Backborn.jsを参考に作られたみたいなので、Backborn.jsに使い慣れている方はぜひ試してみてはいかがでしょう。
・Brain.js
いくつかのtestを行う事で神経回路を読み取りベストなものを算出してくれるjsライブラリ
例えばいくつかの色の組み合わせをテストすることで、そのユーザが一番好きな色の組み合わせを提案できたり。
・Hello.js
FacebookやTwitterのアカウント連携を簡単に実装してくれるライブラリ
・Sigma.js
なんだかよくわかりませんが、とにかくカッコいいグラフを作れるライブラリだそうです。
特にオブジェクト同士の関連図のようなもののグラフに特化しているみたいです。
・Bounce.js
滑らかで柔らかいアニメーションを実装してくれるライブラリ
・Purplecoat.js
クリックするとラベルが表示される機能を実装してくれるライブラリ
・Velocity.js
CSSで設定できるアニメーション速度より速い値のアニメーションを適応してくれるライブラリ
・Transducers.js
これはなんともいえない・・・w
一回みてもらえれば分かります。
・Svg.js
svgを編集したりアニメーションさせたりする軽量なjsライブラリ。
svgはD3などでも使われているし、これは良さそうですね。
・Runtime.JS
V8 JavaScript engineにKarnelを構築してくれるjsライブラリ
かなりコアなのでそんなに該当者いないかもです。
・Gremlin.js
モンキーテストのためのjsライブラリ
どこをクリックしたのかもわかるみたいなので、便利そう！
・Tracking.js
色のトラッキングなど多様なトラッキングを実装してくれるjs
・Intention.js
デバイスに応じて最適なhtmlに再構築してくれるjsライブラリ
相当軽いなら確かにいいかも・・・。
・Please.js
色に特化したjsライブラリ
グラフィカルなサイトを作るときにはいいかも！？
・Doctored.js
エディターの機能に特化したjsライブラリ
エディターを作る際には凄く便利そう！
・App.js
軽量なネイティブアプリライクなUIを提供してくれるライブラリ
jquery-mobileよりはこっちの方が確かによさそう！
・Ripple.js
データバインディングに特化したjsライブラリ。
例では時計をjsで実装しているが、確かにそういったものには凄く便利そう。
・Imgix.js
レスポンシブに応じて画像を作成してくれるjsライブラリ
ファブレットも流行ってくるといよいよデバイスサイズが
かなりのパターン数存在するので、こういうライブラリは重宝しそうですね。
・Particles.js
粒子結合を軽量かつ簡単に実装できるjsライブラリ
D3を筆頭にデータの可視化に特化したライブラリも増えてきてますね。
・JZed.js
jQueryの代替になるようなjsフレームワーク
documentを見た感じjQueryよりは書き方がスマートな印象。
何処までjQueryを補完してくれてるのかが肝ですね。。。
・Gulp.js
Gruntのようなbuildツール
最近よく取り上げられているので知っている人も多いのでは？
参考：
便利なGruntの弱点を補うgulp.jsのインストールと使い方
・Numeral.js
数字をformatに合わせた表示に変更してくれるjsライブラリ
1000と入れれば、1,000にしてくれるみたいな感じです。
・Midnight.js
いくつかのheaderを簡単にswitchできるjsライブラリ
パララックス使っているwebサイトは多いので、これを使えばよりリッチな
ページができますね。
・Nanobar.js
jqueryを必要とせず、軽量なprogress barを提供してくれるjsライブラリ
重たい処理を実行するときはprogress barを付ける方が親切なUIだと思うので
そういった用途では使えそう。
jqueryを必要としないってのもいいですね！
・Cupertino.js
jsのコードをobjective-cに変換してくれるjs
swiftがでた今となっては…って感じですねｗ
・Basil.js
localstorageやcookieなどに簡単にアクセスできるjsライブラリ
DBではなくサービス側にデータを持つようなサービスだと使えそう。
・Less.js
stye-sheetの拡張、LESSに対応してくれるjs
結構前からあるので知っている人も多いのでは？
・Annyang.js
voiceコマンドを提供してくれるjsライブラリ
siriになれてくるとweb上でも音声操作をしたくなるだろうからこれは面白いw
・Comcastify.js
ページローディングを遅くしてくれるライブラリ。
たまには経験したいよね？って説明文に書いてるけど、
遅いページはイライラするから…あんまり経験したくないw
・Formbuilder.js
google docsのようなUIでformを作れるライブラリ
ユーザがwebサービス上でformを作れるような機能を提供する場合には重宝しそう！
・Steady.js
onscrollのイベントを簡単にかつパフォーマンスを低下させる事なく実装してくれるライブラリ
どこまでスクロールしたのか？などを計測したい際にはもってこいですね。
・Orbit.js
データソースや同時アクセスを可能にするjsライブラリ
AngularやVueのmodel部分だけ提供してくれるようなモノでしょうか。
・Intercooler.js
ajaxを簡単に実装できるようなライブラリ
done/failなど結果に応じてresponseを変えられるのかは不明だが、
htmlの要素として突っ込むだけで実装してくれる手軽さ
・Easystar.js
非同期処理のパフォーマンスをあげてくれるためのjsライブラリ
シンプルなAPIでできるので、簡単かつ5kb以下とファイルサイズも小さいw
確かにこれいれて読み込み速度落ちたら意味ないから、納得ですが。
・Gif.js
GIFアニメーションを編集できるjsライブラリ。
質や速度なんかも変更できる。
・RulersGuides.js
PhotoshopのようなメモリをWebページに実装してくれるライブラリ。
コンテンツを作れるようなWebサービス以外での使い道は…不明ですw
・Cheet.js
コナミコマンド等が簡単に実装できるライブラリ
twitterなども隠しコマンドを実装してたりするけど、
これ使ったらめっちゃ簡単にできるw
・GNU ease.js
オブジェクト指向のjsフレームワーク
クラスが簡単に実装できたり、Javaのように抽象クラスを実装できたり。
・heatmapjs
リアルタイムにheatmap作成できるjsライブラリ
clicktaleライクな事ができそうですね。
・swing.js
tinderライクなカードを右 or 左に移動できるjsライブラリ
webだとどういう使い方があるんだろうか・・・w
・scrollrevealjs
Scrollに応じてコンテンツを出すようなアニメーションを実装してくれるjsライブラリ
・Tourist.js
intro.jsと同じようなライブラリ
intro.jsとどっちがいいのかは不明