50 JavaScript Libraries For Front-End Developer 2019

Here are 50 JavaScript libraries that will let you us speed up and optimise frontend development workflow and help you to achieve desired result in certain deadline.

Dynamics.js

It is a JavaScript library to create physics-based animations.

Javascript library to create physics-based animations

Walkway.js

An easy way to animate SVG elements.

walkway

SVG Morpheus

JavaScript library enabling SVG icons to morph from one to the other. It implements Material Design’s Delightful Details transitions.

SVG Morpheus

Rune.js

It is for programming graphic design systems with SVG. It features a chainable drawing API, an unobtrusive scene graph, and a range of features aimed specifically at graphic designers: native support for color conversion, grid systems, typography, pixel iteration, as well as an expanding set of computational geometry helpers.

runjs

Snap.svg

SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM.

snapSVG

Vivus

It is a lightweight JavaScript clas that allows you to animate SVGs, giving them the appearence of being drawn. There are a variety of different animations available, as well as the option to create a custom script to draw your SVG in whatever way you like.

vivus, bringing your SVGs to life

lazysizes

High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.

lazysizes

layzr.js

Lazy loading boosts page speed by deferring the loading of images until they’re in (or near) the viewport. This library makes it completely painless – maximizing speed by keeping options to a minimum.

lazy

Highlighter.js

Highlighter.js is a tiny library, to allow you to easily navigate, select and highlight the DOM elements.

Highlighter.js

PleaseJS

Please.js is a polite companion that wants to help you make your projects beautiful. It uses HSV color space to create random pleasing colors as well as color schemes based on a given color. It has two core functions and a bunch of little helpers for you to use.

Pleasejs

Numeral.js

Formatting and manipulating numbers.

Numeraljs

Sugar

Etends native objects with helpful methods. It is designed to be intuitive, unobtrusive, and let you do more with less code.

sugarJS

Keypress

A robust library for capturing keyboard input.

keypress

Boba.js

Boba.js is a small, easily extensible JavaScript library that makes working with Google Analytics easier.

A JavaScript library for Google Analytics

Conditioner.js

For loading and unloading behavior based on environment conditions.

conditioner.js

imgix.js

imgix.js allows you to easily use the imgix API to make images on your site or app responsive to device size and pixel density.

Your toolbox for truly responsive images.

Wallop

A minimal 4kb library for showing & hiding things.

Much more than just a slider

FamousEngine

High-performance javascript library for animations & interfaces.

FamousEngine

particles.js

It helps you create an animated & interactive Particle System that reacts to viewer’s cursor. Based on Html5 canvas element.

particleJS

chroma.js

For all kinds of color conversions and color scales.

chromajs

vibrant.js

Extract prominent colors from an image. Vibrant.js is a javascript port of the awesome Palette class in the Android support library.

Vibrant.js

gradStop.js

Generate monotone color schemes and equidistant gradient stops.

gradstop

Random Color

A tiny script for generating attractive random colors.

random color

Gifshot

JavaScript library that can create animated GIFs from media streams, videos, or images.

gifshot

Sortable

Reorderable drag-and-drop lists on modern browsers and touch devices. No jQuery. Supports Meteor, AngularJS, React and any CSS library, e.g. Bootstrap.

Sortable

Space.js

A HTML-driven JavaScript-library for narrative 3D-scrolling.

spaceJS

ScrollMagic

ScrollMagic helps you to easily react to the user’s current scroll position.

scrollmagic.io

scrollMonitor

A simple and fast API to monitor elements as you scroll.

scrollMonitor

Moment.js

Parse, validate, manipulate, and display dates in JavaScript.

momentjs

MockTheClock

Spoof timers and other date/time functions. Useful for slowing down 3D animations.

Mocktheclock

dragscroll

Enables scrolling via holding the mouse button (“drag and drop” or “click and hold” style, online demo). It has no dependencies and is written in vanilla JavaScript (which means it works anywhere).

dragscroll

JavaScript Cookie

A simple, lightweight JavaScript API for handling cookies.

Javascript cookie

clipboard.js

A modern approach to copy text to clipboard.

clipboardjs

ContentTools

A JS library for building WYSIWYG editors for HTML content.

A beautiful & small content editor

Pen Editor

A markdown editor you really want.

pen editor

Substituteteacher.js

substituteteacher.js lets you substitute sentences for each other, swapping only the words necessary.

substituteteacher

Blast

Play with typography, animate letters, break apart words, reassemble sentences..

blastjs

underlinejs

Pushing the boundary of browser typography rendering!

undeline

SweetAlert

An awesome replacement for JavaScript’s alert.

sweetalert

FastClick

FastClick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers. The aim is to make your application feel less laggy and more responsive while avoiding any interference with your current logic.

fastclick

Touchpoint-js

A vanilla JavaScript library that visually shows taps/clicks for HTML prototypes using CSS3 transitions on desktop and mobile.

touchpoint

Slip.js

A tiny library for interactive swiping and reordering of elements in lists on touch screens. No dependencies.

slipjs

QRCode.js

QRCode.js supports Cross-browser with HTML5 Canvas and table tag in DOM. QRCode.js has no dependencies.

qrcode js

Piecon

Utility that allows you to add a piechart as your favicon. It’s a small library, but shows some pretty neat potential.

piecon

Circle

Circles makes creating the charts very easy. Circles generates the SVG chart on the fly.

circle

Resemble.js

It analyses and compares images with HTML5 canvas and JavaScript.

Image analysis and comparison

PhotoSwipe

JavaScript image gallery for mobile and desktop, modular, framework independent.

photoswipe

Ideal Image Slider

Quite simply the ideal Image Slider in vanilla JS.

Ideal Image Slider

Rome

Customizable date (and time) picker. Opt-in UI, no jQuery! Rome synchronizes in real-time with inputs, never steals focus, and its CSS is entirely customizable!

Customizable date (and time) picker.

Pikaday

A refreshing JavaScript Datepicker — lightweight, no dependencies, modular CSS.

pikaday

1 Comments

  1. Shwetasays:

    Hi

    Thanks for sharing these resources. However, I would like to add one – ImageKit.io (https://imagekit.io) for real-time image optimization. Its API works with AWS, HTTP site, Magento, Shopify, or any WordPress site and provides UR based transformation to website images.

Leave a comment

Please be polite. We appreciate that. Your email address will not be published and required fields are marked

This site uses Akismet to reduce spam. Learn how your comment data is processed.