Libraries

Draggable by Shopify - “a lightweight, responsive, modern drag & drop library”

Clipboard.js

Clippy.js - “Add Clippy or his friends to any website for instant nostalgia. Our research shows that people love two things: failed Microsoft technologies and obscure Javascript libraries. Naturally, we decided to combine the two.”

Guess.js - “Guess.js provides a collection of libraries for enabling machine-learning driven experience for the Web. Currently, the project has two main modules: Predictive prefetching for static websites. Predictive prefetching for JavaScript frameworks.”

http://instantclick.io/

Leaflet - “an open-source JavaScript library for mobile-friendly interactive maps.” Uses OpenStreetMap data.

Preact - “Fast 3kB alternative to React with the same ES6 API.”

http://qunitjs.com/

Redux - "A Predictable State Container for JS Apps"

Scrollama.js - “Scrollama is a modern and lightweight JavaScript library for scrollytelling using IntersectionObserver in favor of scroll events.”

SnackbarJS - “SnackbarJS is a lightweight and jQuery powered plugin made to work in Bootstrap style, just like the Bootstrap tooltips work.”

Trix - “A rich text editor for everyday writing. Compose beautifully formatted text in your web application. Trix is an editor for writing messages, comments, articles, and lists—the simple documents most web apps are made of. It features a sophisticated document model, support for embedded attachments, and outputs terse and consistent HTML.”

Guess.js - “Guess.js provides a collection of libraries for enabling machine-learning driven experience for the Web. Currently, the project has two main modules: Predictive prefetching for static websites. Predictive prefetching for JavaScript frameworks.”

Gulp.js - “Automate and enhance your workflow. gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.”

Animation

Anime.js - “Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes and JavaScript Objects.”

Mo.js - "mo · js is a javascript motion graphics library that is a fast, retina ready, modular and open source. In comparison to other libraries, it have a different syntax and code animation structure approach. The declarative API provides you a complete control over the animation, making it customizable with ease."

PixiJS - “The HTML5 Creation Engine. Create beautiful digital content with the fastest, most flexible 2D WebGL renderer.”

three.js - "The aim of the project is to create an easy to use, lightweight, 3D library with a default WebGL renderer. The library also provides Canvas 2D, SVG and CSS3D renderers in the examples."

Parallax

basicScroll - “Standalone parallax scrolling with CSS variables. basicScroll allows you to change CSS variables depending on the scroll position. Use the variables directly in your CSS to animate whatever you want.” According to Matthew, doesn’t break inertial scrolling, unlike most Parallax libraries.

Rellax - "Light (1021b gz) Vanilla Javascript Parallax Library"

File Upload

Filestack - "The File Handling Service for Developers. Powerful APIs that allow you to upload, transform and deliver any file into your app."

Uppy - "Sleek, modular open source JavaScript file uploader. Uppy fetches files locally and from remote places like Dropbox or Instagram. With its seamless integration, reliability and ease of use, Uppy is truly your best friend in file uploading."

Forms

Chosen - "Chosen is a jQuery plugin that makes long, unwieldy select boxes much more user-friendly."

Cleave.js - “Format your <input/> content when you are typing”

Formik - For React.

Select2 - “The jQuery replacement for select boxes. Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.”

Identicons

https://kawaii-avatar.now.sh/ https://github.com/DannyBen/icodi https://github.blog/2013-08-14-identicons/ https://en.wikipedia.org/wiki/Identicon https://blog.docuverse.com/tag/identicon/ https://github.com/PauloMigAlmeida/identicon https://haacked.com/archive/2007/01/22/Identicons_as_Visual_Fingerprints.aspx/ https://sourceforge.net/projects/identicons/ https://github.com/donpark/identicon https://web.archive.org/web/20150120215011/http://identicon.riaforge.org/ https://github.com/cupcake/sigil https://github.com/RobThree/NIdenticon https://www.idbloc.co/blog/product/update/2019/05/09/toggles-identicons-and-beauty.html#identicons-what-are-those https://en.gravatar.com/ https://github.com/elierotenberg/react-identicon https://cnpmjs.org/package/@polkadot/react-identicon/v/0.43.0-beta.1 https://github.com/ruchevits/react-identity-icon https://github.com/polkawallet-io/polkadot-identicon-react-native https://github.com/topics/identicon?o=asc&s=stars https://github.com/austintgriffith/react-blockies-image https://github.com/AugurProject/react-blockies https://github.com/ethereum/blockies

Image Manipulation

Filestack - "The File Handling Service for Developers. Powerful APIs that allow you to upload, transform and deliver any file into your app."

Resemble.js - “Resemble.js analyses and compares images with HTML5 canvas and JavaScript.”

Vibrant.js - “Extract prominent colors from an image.”

Placeholders

BlurHash - "BlurHash is a compact representation of a placeholder for an image. Does your designer cry every time you load their beautifully designed screen, and it is full of empty boxes because all the images have not loaded yet? Does your database engineer cry when you want to solve this by trying to cram little thumbnail images into your data to show as placeholders? BlurHash will solve your problems!"

Holder.js - “Holder renders image placeholders entirely in browser. Placeholders can have custom colors, fonts, resizing behavior, and rendering engine (Canvas/SVG).”

Holder on cdnjsTransparent Image #151 - “this is now implemented. you can set foreground or background to an rgba color, so a transparent placeholder can be created like this: holder.js/300x200?bg=rgba(0,0,0,0.0)”

Tooltips

Popper - "TOOLTIP & POPOVER POSITIONING ENGINE"

react-tooltip

Tippy.js - “A lightweight, vanilla JavaScript tooltip library." Tippy.js for React.

Last updated