JS libs

From Things and Stuff Wiki
Revision as of 13:29, 20 June 2024 by Milk (talk | contribs) (→‎HTMX)
Jump to navigation Jump to search


General

oooolldd


headings need a real good rearrange

Repos and listings

  • JSter Javascript Catalog - a catalog of frontend JavaScript libraries. We also maintain a blog and publish a monthly newsletter.


  • Microjs - Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit!



  • Unheap - A tidy Repository of jQuery Plugins & JavaScripts


  • JavascriptOO - every javascript project you should be looking into, with examples, categories, install commands, CDN links, project and author stats, and more.


  • JSAN - JavaScript Archive Network is a comprehensive resource for Open Source JavaScript libraries and software.
    • JSwiki - indexes libraries and resources available for JavaScript. In addition it provides some starting points for newbies in form of Beginner's Resources. In case you want to contribute, do take a look at Meta first for some extra pointers. Happy hacking!



CDN


  • jsDelivr - A free, fast, and reliable Open Source CDN for npm & GitHub


  • Google Libraries API - a content distribution network for the most popular, open-source JavaScript libraries. The Libraries API provides access to a growing list of the most popular, open-source JavaScript libraries, including: AngularJS, Chrome Frame, Dojo, Ext Core, jQuery, jQuery UI, MooTools, Prototype, script.aculo.us, SWFObject, WebFont Loader
    • irc.geekshed.net, #googleapis


Scripts



Modules and loading

  • RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.


  • https://github.com/tildeio/rsvp.js - provides simple tools for organizing asynchronous code. Specifically, it is a tiny implementation of Promises/A+ and a mixin for turning objects into event targets.



  • Spin.js - dynamically creates spinning activity indicators that can be used as resolution-independent replacement for AJAX loading GIFs.


  • NProgress.js - Small nanoscopic progress bar. Featuring realistic trickle animations to convince your users that something is happening!


  • InstantClick - a JavaScript library that dramatically speeds up your website using preloading on hover, making navigation effectively instant in most cases. [1]



  • Browserify - lets you require('modules') in the browser by bundling up all of your dependencies.



Utility

  • Lo-Dash - A low-level utility library delivering consistency, customization, performance, and extra features.


  • Augment.js - Enables use of modern JavaScript by augmenting built in objects with the latest JavaScript methods. Never overrides any native implementations; it only adds what is missing.
  • Prototype is a JavaScript Framework that aims to ease development of dynamic web applications. Featuring a unique, easy-to-use toolkit for class-driven development and the nicest Ajax library around, Prototype is quickly becoming the codebase of choice for web application developers everywhere.
  • Underscore is a utility-belt library for JavaScript that provides a lot of the functional programming support that you would expect in Prototype.js (or Ruby), but without extending any of the built-in JavaScript objects. It's the tie to go along with jQuery's tux, and Backbone.js's suspenders.
    • underscore-contrib The brass buckles on Underscore's utility belt - a contributor library for Underscore.
  • Lazy.js it a utility library for JavaScript, similar to Underscore and Lo-Dash but with one important difference: lazy evaluation (also known as deferred execution). This can translate to superior performance in many cases, especially when dealing with large arrays and/or "chaining" together multiple methods. For simple cases (map, filter, etc.) on small arrays, Lazy's performance should be similar to Underscore or Lo-Dash.
  • wu.js - A lazy, functional Javascript library that ain't nuthin' ta f*ck wit.
  • Functional is a library for functional programming in JavaScript. It defines the standard higher-order functions such as map, reduce (aka foldl), and select (aka filter). It also defines functions such as curry, rcurry, and partial for partial function application; and compose, guard, and until for function-level programming. And all these functions accept strings, such as 'x -> x+1', 'x+1', or '+1' as synonyms for the more verbose function(x) {return x+1}.
  • Udon is a library providing basic support for functional programming idioms in JavaScript.
  • OxJS is Ox.js, a general-purpose utility library. It embraces functional programming, supports modules, provides lots of tools to deal with dates, has all the missing math methods (plus some more for geographic coordinates) and helper functions for strings and regular expressions, fixes type detection and equality testing, includes utilities to handle HTML, the DOM and remote requests, can tokenize and minify JavaScript, comes with its own documentation format, including inline tests, and does many other cool things. Then there are modules, most notably Ox.UI, which provides a simple but flexible model to write complex, desktop-class web applications for HTML5-compliant browsers.
  • funkjs is a pure functional immutable library without side effects. It consists of: list library (good to have functional list library). stream library (lazy list), tuple (immutable tuple implementation), semigroup (basic semigroup library + 11 predefined semigroups), monoid (basic monoid library + 9 predefined monoids)
  • allong.es is a collection of functions designed to facilitate writing JavaScript and/or CoffeeScript with functions as first-class values. The emphasis in allong.es is on composing and decomposing functions using combinators and decorators. allong.es is designed to complement libraries like Underscore, not compete with them.
  • Behave.js - Less-than-pure Functional Reactive Programming for Javascript
  • Valentine provides you with type checking, functional iterators, and common utility helpers such as waterfalls, queues, and parallels; all utilizing native JavaScript methods (when available) for optimal speed. Inspired by Underscore.
  • Sugar is a Javascript library that extends native objects with helpful methods. It is designed to be intuitive, unobtrusive, and let you do more with less code.
  • Matches.js brings the power and expressiveness of pattern matching to Javascript.
  • objgrep Find strings inside complicated javascript objects
  • Prevel - a lightweight (~5 Kb) JavaScript library with strong functionality. Dom and Ajax.
  • Minified.js is a client-side JavaScript library, comparable to jQuery and MooTools in scope. Its features include DOM manipulation, animation, events, cookies and HTTP requests. [4]
  • WebActors is a simple library for managing concurrency in JavaScript programs. It's heavily based on Erlang's interpretation of the Actor Model.



Type checking


jQuery

See also jQuery

to sort


Templating

See also JavaScript#Templating

  • Hogan.js is a 2.5k JS templating engine developed at Twitter. Use it as a part of your asset packager to compile templates ahead of time or include it in your browser to handle dynamic templates.
  • Walrus is a templating library inspired by mustache, handlebars, ejs and friends, but with a couple of important differences in philosophy and style
  • jQuery Template is a jQuery plugin that makes using templates easy and quick. The plugin supports loading HTML files as templates, or taking a jQuery object as the template (usually using script tags to hold the template).
  • t.js - A tiny javascript templating framework in ~400 bytes gzipped
  • Dust is a JavaScript templating engine designed to provide a clean separation between presentation and logic without sacrificing ease of use. It is particularly well-suited for asynchronous and streaming applications.
  • Nunjucks is a full featured templating engine for javascript.
  • dōmo lets you write HTML markup CSS styles in JavaScript syntax, in the browser and on the server. At less than 1.4kb of minizipped JavaScript, dōmo is a simpler, easier, and more reliable alternative to template engines and CSS pre-processors. And it works well with all the tools you already use, from jQuery to Backbone.js to CoffeeScript.
  • templayed.js - The fastest and smallest Mustache compliant Javascript templating library written in 1806 bytes (uncompressed)
  • Pithy.js - An internal DSL for generating HTML in JavaScript.
  • json2html is an open source javascript library that uses on JSON templates to convert JSON objects to HTML.
  • X-Tag - X-Tag is a small JavaScript library, created and supported by Mozilla, that brings Web Components Custom Element capabilities to all modern browsers.
  • pajama.js is a serverside and clientside templating engine which makes use of model-view data bindings to remove all HTML from your Javascript project
  • Teddy is an easy-to-read, HTML-based, mostly logic-less DOM templating engine with support for both server-side and client-side templating.


DOM

  • Laconic DOM Library - Laconic offers an intuitive approach to generating DOM content in JavaScript. Laconic adds a method to the $.el namespace for all known HTML Elements. These methods should be invoked with a variable-length list of child elements, strings, numbers, or arrays containing these types. An optional attributes object may be passed as the first argument.
  • rangy - A cross-browser JavaScript range and selection library. It provides a simple standards-based API for performing common DOM Range and Selection tasks in all major browsers, abstracting away the wildly different implementations of this functionality between Internet Explorer up to and including version 8 and DOM-compliant browsers.
  • uiji is jQuery in reverse. Instead of using CSS selectors to find elements, you use the same syntax to create elements.
  • fasterDOM.js - Fast DOM manipulation with "jquery-like" syntax and ~1.8Kb code. Operations that are supported: .css(), .attr(), .html(), .append(), .prepend(), .show(), .hide() , .get() (returns elements)
  • QuoJS is a micro, modular, Object-Oriented and concise JavaScript Library that simplifies HTML document traversing, event handling, and Ajax interactions for rapid mobile web development. It allows you to write powerful, flexible and cross-browser code with its elegant, well documented and micro coherent API.


Ajax

  • Phonebook.js is a lightweight wrapper for your jQuery.ajax calls. It makes your code more readable and more maintainable.


Data binding



Typography


Lettering.js


FitText

  • FitText - Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.
$("#responsive_headline").fitText();

$("#responsive_headline").fitText(1.2); // Turn the compressor up   (text shrinks more aggressively)
$("#responsive_headline").fitText(0.8); // Turn the compressor down (text shrinks less aggressively)

$("#responsive_headline").fitText(1.2, { minFontSize: '20px', maxFontSize: '40px' })


jquery.textFit


Hatchsow


slabText


BalanceText

  • BalanceText - A jQuery plugin to provide an alternate text wrapping algorithm.


to sort

  • Circletype.js is a tiny (2.7kb) jQuery plugin that lets you set type on a circle
  • strokeText.js is an unobtrusive javascript library working in all the major browsers - Mozilla Firefox 1.5+, Opera 9+, Safari and IE6+. The library provides cross API text stroking capability for Canvas and VML.


Layout


Text



Textarea


Lists


Tables

  • DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table


Forms


  • FormValidation - The best validation library for JavaScript. Written in ES6Type safety using TypeScript. Zero dependenciesNo jQueryCan be used as AMD, ES6 modules and global scripts.

Interface

  • Create.js is a comprehensive web editing interface for Content Management Systems. It is designed to provide a modern, fully browser-based HTML5 environment for managing content. Create can be adapted to work on almost any content management backend.
  • Tuxedo.js - Tuxx is a feature complete framework built on the React view layer, Flux Architecture, and CommonJS modules [19]
  • jsblock - Better MV-ish Framework. From simple user interfaces to complex single-page applications using faster, server-side rendered and easy to learn framework. [20]



jQuery UI

  • jQuery UI is a curated set of user interface interactions, effects, widgets, and themes built on top of the jQuery JavaScript Library. Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.


Scroll to anchor

$('body').plusAnchor({
  easing: 'swing',
    // The easing method, defaults are 'swing' and 'linear'.
    // Anything else  requires the easing.js plugin
  speed:  1000
    // The amount of time, in milisecons, it takes to complete a transition
});
$("#someDiv").slideto({
  highlight_color: 'blue',
  highlight_duration: 'slow',
  slide_duration: 500
});
$("some_selector").scrollintoview({
   duration: 2500,
   direction: "vertical",
   complete: function() {
     // highlight the element so user's focus gets where it needs to be
   }
});
$(...).scrollTo( 'li:eq(15)', 1000, {offset: {top:-5, left:-30} });
$('a').smoothScroll();
$('#container a').smoothScroll();
$('#container a').smoothScroll({excludeWithin: ['.container2']});
  exclude links if they are within a containing element: 
$('a').smoothScroll({exclude: ['.rough','#chunky']});
  exclude links if they match certain conditions
$('.backtotop').smoothScroll({offset: -100});
  adjust where the scrolling stops
$('a').smoothScroll({afterScroll: function() { alert('we made it!'); }});
  add a callback function that is triggered after the scroll is complete 
{
  offset: 0,
  direction: 'top', // one of 'top' or 'left'
  scrollTarget: null, // only use if you want to override default behavior
  afterScroll: null, // function to be called after scrolling occurs. "this" is the triggering element
  easing: 'swing',
  speed: 400
}



Scroll with page


Scrolling and parallax


Popup


Navigation

ToC





Tooltips

  • qTip2 - Pretty powerful tooltips


Lightbox


Carousel

$("ul#roundabout").roundabout({
   autoplay: true,
   autoplayInitialDelay: 2000
});

The above works only for the first instance. Use window.setTimeout to alter further IDs. [26]


URL

  • url() A simple, lightweight url parser for JavaScript (~1.6 Kb minified, ~0.6Kb gzipped).


Events / calendar



Dates


Viewport

  • Keep in View - Don't allow elements to scroll out of view by having them stick to the top or bottom of a window.
  • retina.js is an open source script that makes it easy to serve high-resolution images to devices with retina displays


Fullscreen


Scrollbars


Keyboard

  • Mousetrap - A simple library for handling keyboard shortcuts in Javascript.


Mouse


Media

  • MediaElement.js - a blazingly fast and amazingly powerful HTML5 audio and video library that creates a unified feel for for all media files (MP4, WebM, MP3, FLV), streaming content (HLS, M(PEG)-DASH, RTMP), and embeddable players like YouTube, Vimeo, DailyMotion, Facebook, and SoundCloud.




  • Projekktor - a self-hosted, open source video (and audio) player for the web, written in Javascript, released under GPLv3. It simplifies the way you implement and work with web video by solving tons of cross browser- and compatibility- issues, adding eye candy and by providing extremely powerful non standard features.



  • https://github.com/mozilla/popcorn-js - Mozilla's HTML5 video and media library for the open web. It allows web developers, filmmakers, artists, designers and others to easily create timeline based web productions. Popcorn.js helps simplify media API and implementation differences between browsers and includes a powerful event system and a rich plugin architecture and plugins. This project is no longer maintained.



  • Wimpy Player - a javascript HTML5 audio player & video player that's easy to set up, design, configure and customize. Works on all devices, Custom Skins, Fluid + Responsive, Extensive Javascript API, No Dependencies (doesn't require jQuery or similar), Built on pure Javascript, CSS & HTML5, Playlists supported: JSON, XML, RSS, Text & more, Works with any CMS template or platform. $$




Audio

See also Audio#Web players





  • browserLoop - An attempt to replicate ableton-like loop playing in the browser














  • https://github.com/torcado194/scritch-player - a simple HTML media player designed for ease of creation and customization. If you have a collection of audio files, simply drop them in and upload to a website to get a player to listen to it! The original intention was to create a media player for musicians to use to upload their albums to itch.io. Something for them to easily copy/migrate their existing albums from sites like bandcamp.
  • https://github.com/blackle/blamscamp - lets you create a bandcamp-style audio player for an individual album. The player is an entirely self-contained website, and can be hosted on a variety of platforms, but was designed specifically for itch.io.


  • https://github.com/goldfire/howler.js - an audio library for the modern web. It defaults to Web Audio API and falls back to HTML5 Audio. This makes working with audio in JavaScript easy and reliable across all platforms.


MIDI





Video






  • https://gitlab.com/agrahn/ABLoopPlayer - A media player based on HTML5, jQuery and JavaScript, with A-B repeat, fast/slow motion and bookmarking functionality for online video (YouTube) and local video and audio files in the MP4/H.264, WebM, Ogg, MP3, WAV formats

Images

  • Gradify is a module which finds the most prominent colors in any image, and produces a scalable, responsive CSS gradient. This can provide a less jarring experience as image placeholders.



Transforms


Animation

  • jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It's great to use as a hover effect or a way to direct attention to an element.


Canvas


  • goo.js is a microlibrary intended to make it easy to draw and handle mouse and keyboard events with the HTML5 canvas library.






  • https://github.com/samizdatco/skia-canvas - a browser-less implementation of the HTML Canvas drawing API for Node.js. It is based on Google’s Skia graphics engine and, accordingly, produces very similar results to Chrome’s element. The library is well suited for use on desktop machines where you can render hardware-accelerated graphics to a window and on the server where it can output a variety of image formats.

While the primary goal of this project is to provide a reliable emulation of the standard API according to the spec, it also extends it in a number of areas to take greater advantage of Skia's advanced graphical features and provide a more expressive coding environment.

Graphics

  • Datavisualization.ch Selected Tools is a collection of tools that we, the people behind Datavisualization.ch, work with on a daily basis and recommend warmly. This is not a list of everything out there, but instead a thoughtfully curated selection of our favourite tools that will make your life easier creating meaningful and beautiful data visualizations.


D3


Graphs

  • Springy - A force directed graph layout algorithm in JavaScript. -
  • Sigma is a JavaScript library dedicated to graph drawing. It makes easy to publish networks on Web pages, and allows developers to integrate network exploration in rich Web applications.


Colours



Textures


Shapes


Other

  • Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library. Uses the SVG W3C Recommendation and VML as a base for creating graphics. This means every graphical object you create is also a DOM object, so you can attach JavaScript event handlers or modify them later.
  • gRaphaël’s goal is to help you create stunning charts on your website. It is based on Raphaël graphics library. Check out the demos to see static and interactive charts in action.
  • Donatello is a pure-CSS drawing library for the browser. The API is inspired in part by Raphael.js. All graphical elements are rendered using HTML DOM and CSS.
  • Dojo GFX is a cross-browser 2D vector graphics API that enables development of rich graphic web application on desktop and mobile without having to deal with the browsers native graphics technologies.
  • Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface.
  • Bonsai - A lightweight graphics library with an intuitive graphics API and an SVG renderer.
  • Two.js is a two-dimensional drawing api geared towards modern web browsers. It is renderer agnostic enabling the same api to draw in multiple contexts: svg, canvas, and webgl.
  • svg.js - A lightweight library for manipulating and animating SVG.
  • glfx.js - Adjust photos in your browser in realtime with glfx.js, an image effects library powered by WebGL. It uses your graphics card for image effects that would be impossible to apply in real-time with JavaScript alone.
  • Processing.js is the sister project of the popular Processing visual programming language, designed for the web. Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins. You write code using the Processing language, include it in your web page, and Processing.js does the rest. It's not magic, but almost.


Snap.svg


VVVV.js


Isometric


Ray trace


anypixel.js


Diagrams


Presentation

  • h5slides - basic presentation system, in chinese
  • Impress.js - It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.
    • Strut - Presentation editor for Impress.js
  • jmpress.js - jQuery and Impress.js, a jQuery plugin to build a website on the infinite canvas
  • dizzy.js is a Javascript library that enables you to create nonlinear presentations similiar to Prezi without using Flash. The presentation data is stored in the SVG-format, the navigation and animation is done via Javascript.
  • reveal.js - A framework for easily creating beautiful presentations using HTML. reveal.js comes with a broad range of features including nested slides, markdown contents, PDF export, speaker notes and a JavaScript API. It's best viewed in a browser with support for CSS 3D transforms but fallbacks are available to make sure your presentation can still be viewed elsewhere.


Scrolling


  • https://github.com/Prinzhorn/skrollr - Parallax* scrolling lib with zero dependencies (seriously, you don't need jQuery) in just under 5.5k minified (2.6k gzipped). No JavaScript skills needed.



Deep Zoom like



Mapping


Maths

  • Numeric Javascript library allows you to perform sophisticated numerical computations in pure javascript in the browser and elsewhere.
  • jStat is a statistical library written in JavaScript that allows you to perform advanced statistical operations without the need of a dedicated statistical language
  • Simple statistics is a JavaScript library that does descriptive statistics, regression, and classification. It can tell you basic things like minimum and maximum, but it can also compute tricky things like standard deviation and sample correlation.
  • MathJax is an open source JavaScript display engine for mathematics that works in all modern browsers.


3D


Three.js






Polygon.js

  • Polygonjs - WebGL Design & Animation Tool, Node-Based Design & Animation Tool for the Web

Physics


Menu / tabs


Alerts and tooltips


Notifications


Reading

  • Fokus uses JavaScript to emphasize anything you select by covering the rest of the page with semi-transparent black.



WYSIWYG

  • Create.js is a comprehensive web editing interface for Content Management Systems. It is designed to provide a modern, fully browser-based HTML5 environment for managing content. Create can be adapted to work on almost any content management backend.


Twitter


RSS

  • zRSSFeed - will read RSS feeds from any website URL using the Google Feeds API. It produces structured HTML with in-built CSS classes for styling.


Webcam


Voice

  • Artyom.js - Voice commands and speech synthesis made easy. Artyom.js is an useful wrapper of the speechSynthesis and webkitSpeechRecognition APIs. Besides, artyom.js also lets you to add voice commands to your website easily, build your own Google Now, Siri or Cortana!


Floating overlay


Search


Networking


Concurrency


Injection

  • DiceJS (dynamically injected css engine) is a jQuery extension that allows you to store your CSS in JavaScript objects to dynamically manipulate and inject as you please.


Feedback


Introduction overlay


Taxonomy


Time

  • Timeago is a jQuery plugin that makes it easy to support automatically updating fuzzy timestamps (e.g. "4 minutes ago" or "about 1 day ago").]


Waypoints

Actions on certain areas of the page.


Footnotes


Shadows


Audio

See Audio#Web_Audio_API


File upload

  • Dropzone.js - one of the most popular drag and drop JavaScript libraries. It is free, fully open source, and makes it easy for you to handle dropped files on your website. It's meant to look good by default, and is highly customizable.



Github widget


Cryptography


Humour

  • Vanilla JS - a fast, lightweight, cross-platform framework for building incredible, powerful JavaScript applications. [50]
  • HTML9 Responsive Boilerstrap JS - a flexible, dependency-free, lightweight, device-agnostic, modular, baked-in, component framework MVC library shoelacestrap to help you kickstart your responsive CSS-based app architecture backbone kitchensink tweetybirds.



Mobile

Responsive

jQuery Mobile

  • jQuery Mobile - Touch-Optimized Web Framework for Smartphones & Tablets. A unified, HTML5-based user interface system for all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design.

See JQuery#Mobile

Other

  • iUIweb - framework for smartphones & high-end devices. supports iOS, Android, Rim OS6, MeeGo, Bada, WebOS, ... smartphones and tablets
  • dhtmlxSuite is a rich JavaScript library that delivers a complete set of UI components
  • Sencha Touch, a high-performance HTML5 mobile application framework, is the cornerstone of the Sencha HTML5 platform. Built for enabling world-class user experiences, Sencha Touch is the only framework that enables developers to build powerful apps that work on iOS, Android, BlackBerry, Windows Phone, and more.
  • jQT - A Zepto/jQuery plugin for mobile web development on the iPhone, Android, iPod Touch, and other forward-thinking devices.
  • Titanium SDK - Create native, hybrid, and mobile web appsthrough a JavaScript-based SDK
  • Jo - The simple app framework for HTML5. For iOS, Android, webOS, BlackBerry, Chrome OS & anything else with HTML5. Widgets, lists and scrolling goodness using JavaScript & CSS3. Make native mobile apps or web apps with the same code. Works great with PhoneGap
  • Kendo UI - Mobile apps that run everywhere with HTML5 and JavaScript. Build apps that look and feel native to end-users on: (NEW!) WinPhone8, iOS, Android and BlackBerry. Target multiple phone and tablet platforms with a single UI codebase, using only HTML5 and JavaScript.

Libraries and frameworks

  • TodoMVC - Developers these days are spoiled with choice when it comes to selecting an MV* framework for structuring and organizing their JavaScript web apps. Backbone, Ember, AngularJS, Spine... the list of new and stable solutions continues to grow, but just how do you decide on which to use in a sea of so many options?

YUI

  • YUI is a free, open source JavaScript and CSS framework for building richly interactive web applications.

MooTools

  • MooTools is a compact, modular, Object-Oriented JavaScript framework designed for the intermediate to advanced JavaScript developer. It allows you to write powerful, flexible, and cross-browser code with its elegant, well documented, and coherent API.

Google Closure

  • The Closure Library is a broad, well-tested, modular, and cross-browser JavaScript library. You can pull just what you need from a large set of reusable UI widgets and controls, and from lower-level utilities for DOM manipulation, server communication, animation, data structures, unit testing, rich-text editing, and more.

Dojo Toolkit

  • Dojo saves you time and scales with your development process, using web standards as its platform. It’s the toolkit experienced developers turn to for building high quality desktop and mobile web applications.

Knockout

  • Knockout is a JavaScript library that helps you to create rich, responsive display and editor user interfaces with a clean underlying data model. Any time you have sections of UI that update dynamically (e.g., changing depending on the user’s actions or when an external data source changes), KO can help you implement it more simply and maintainably. Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM) pattern.

Backbone.js

  • Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface.

Articles

Docs

Related

  • Backbone UI provides a simple way to represent your Backbone Models and Collections as UI components. The need to shuffle data in and out of your UI is replaced with simple data binding techniques. All components are skinnable with CSS, and will render consistently accross browsers.
  • Recline.js - Building on Backbone, Recline supplies components and structure to data-heavy applications by providing a set of models (Dataset, Record/Row, Field) and views (Grid, Map, Graph etc).
  • Btapp.js provides access to a browser plugin version of uTorrent/BitTorrent via a tree of Backbone Models and Collections. The intent of this project is to allow access to the extensive functionality of a torrent client, from web apps that are as simple as a single Backbone View.
  • Chaplin is an architecture for JavaScript applications using the Backbone.js library. The code is derived from moviepilot.com, a large single-page application.

Ember

AngularJS

  • AngularJS lets you extend HTML vocabulary for your application. The resulting environment is extraordinarily expressive, readable, and quick to develop.


  • http://famo.us/ Famo.us is the only JavaScript framework that includes an open source 3D layout engine fully integrated with a 3D physics animation engine that can render to DOM, Canvas, or WebGL.

Meteor

  • Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.

Fizzygum

  • Fizzygum - Tired of stringing libraries together? Try a new web framework that handles complex things, easily. Fizzygum is designed from the ground up to: make dashboards and visualise data (plots, maps, …), author, organise and navigate documents, insert dynamic calculations anywhere, via simple drag & drop, make custom utilities visually (no coding required), use internal development tools to customise anything, as it runs, do all of the above, concurrently

Other


  • Aura is an event-driven architecture for developing scalable applications using reusable widgets. It works great with Backbone.js, but is framework-agnostic, adapts many best-practice patterns for developing maintainable apps and has first-class support for modern tools like Bower, Grunt and Yeoman.
  • Batman.js is a framework for building rich web applications with CoffeeScript. App code is concise and favors convention over configuration, and packs a powerful system of view bindings and observable properties. The API is designed with developer and designer happiness as its first priority, and while it has no real dependencies, it works quite well with Rails.
  • Bone.io allows you to build realtime HTML5 apps using websockets to deliver "hot" data to the browser. This enables you to easily construct rich, highly responsive user interfaces. In a lot of ways, Bone.io can be viewed as a much improved version of Backbone.js. Backbone, Angular and other older frameworks rely primarily on AJAX and model bindings to get data to the DOM. The problem with this approach is that AJAX has no method for handling bi-directional communication. In the world of modern data-driven HTML5 applications, Bone.io strives to pickup where these other frameworks have left off.





Flutter

  • Flutter - Build apps for any screen. Flutter transforms the app development process. Build, test, and deploy beautiful mobile, web, desktop, and embedded apps from a single codebase. Get started Notification Flutter 3.13 is here! Learn more. Flutter is an open source framework by Google for building beautiful, natively compiled, multi-platform applications from a single codebase.

HTMX

  • https://htmx.org/ - allows you to access AJAX, CSS Transitions, WebSockets and Server Sent Events directly in HTML, using attributes, so you can build modern user interfaces with the simplicity and power of hypertexthtmx is small (~9k min.gz'd), dependency-free, extendable & IE11 compatible [62] [63]




  • Hypermedia Systems [64] - A simpler approach to building applications on the Web and beyond with htmx and Hyperview. Enhancing web applications without using SPA frameworks. [65]

Mavo

  • Mavo - Create complex, reactive, persistent web applications by just writing HTML & CSS, without a single line of JavaScript and no server backend. Developed in the Haystack Group at MIT CSAIL and led by Lea Verou.

Storage

Games

to sort

  • cujo is an architectural framework for next generation JavaScript applications. It encourages highly modular development, declarative application assembly, and embraces the asynchronous nature of JavaScript and its fusion of object-oriented and functional programming styles. cujo’s extensible architecture and use of industry standards allows it to work seamlessly with your current application framework -- and adapt easily to your next.
  • CanJS is a MIT-licensed, client-side, JavaScript framework that makes building rich web applications easy
  • Cappuccino is built on top of standard web technologies like JavaScript, and it implements most of the familiar APIs from GNUstep and Apple's Cocoa frameworks. When you program in Cappuccino, you don't need to concern yourself with the complexities of traditional web technologies like HTML, CSS, or even the DOM.
  • Seed is a library and interpreter, dynamically bridging (through GObjectIntrospection) the WebKit JavaScriptCore engine, with the GNOME platform. Seed serves as something which enables you to write standalone applications in JavaScript, or easily enable your application to be extensible in JavaScript.
  • Montage simplifies rich HTML5 application development by providing modular components, real-time two-way data binding, CommonJS dependency management, and more.
  • Opa is an advanced application framework for JavaScript. All aspects are directly written in Opa: Frontend code, backend code, database queries and configuration. And everything is strongly statically typed.
  • DoubleDollar is a new kind of JavaScript Framework, that enables you to create pure JavaScript applications with beautiful Zen-like code. Built on jQuery, DoubleDollar is lightning fast, requires no compiler, and is infinitely extendable.
  • Sammy.js is a tiny JavaScript framework developed to ease the pain and provide a basic structure for developing JavaScript applications.
  • Kendo UI has it all: rich jQuery-based widgets, a simple and consistent programming interface, a rock-solid DataSource, validation, internationalization, a MVVM framework, themes, templates and the list goes on.
  • JavaScriptMVC is a MIT licensed, client-side, JavaScript framework that builds maintainable, error-free, lightweight applications as quick as possible. It packs best-of-breed libraries and tools that are guaranteed to work together. It supports every browser that jQuery supports.
  • component - modular framework; client package management
  • ColtJS is a simple framework allowing for easy deployment of JavaScript Applications using Asynchronous Module Definition (AMD). It's only dependency is RequireJS. The central concept behind behind Colt is simplicity. The framework is built to be lightweight, flexible, and highly efficient.

Caching

  • jStorage is a simple wrapper plugin for Prototype, MooTools and jQuery to cache data (string, numbers, objects, even XML nodes) on browser side. Note that functions, DOM nodes, host objects and such can not be saved. jStorage was first developed under the name of DOMCached but since a lot of features were dropped to make it simpler (like the support for namespaces and such) it was renamed. DOMCached had separate files for working with Prototype and jQuery but jStorage can handle both in one go.
  • locache.js is a simple framework to help you cache objects on the client-side. It's not a replacement for HTTP caching, and often that is a better idea. Rather it allows you to cache JavaScript objects ( anything that is JSON serialisable) for re-use or offline usage. You can optionally provide an expiration time for cached objects.
  • AES.io offers online tools for secure data storage and collaboration. We use client-side encryption to ensure all information is safe - both private and shared.

Sharing

  • Sharrre is a jQuery plugin that allows you to create nice widgets sharing for Facebook, Twitter, Google Plus (with PHP script) and more.


Syntax highlighting

  • Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s a spin-off from Dabblet and is tested there daily by thousands.

Emulation

  • n64js - A work-in-progress n64 emulator.

Code visualisation