10 Chapter 10 – JavaScript Libraries
A JavaScript library is a collection of function that speed up the development of a web site. There are a range of libraries available and many have strong communities that assist in improving the functionality and supporting users. This chapter provides an overview of popular libraries and how you can get started with them.
When choosing a library, it is important to assess your application requirements and experience. Some libraries lack documentation, especially if newly released. Mature libraries have an advantage when it comes to community support, documentation, and life-cycle. Younger libraries may be short-lived or require code to be rewritten when new versions are released. However, the benefit of a younger library is that they often employ novel approaches and may be more efficient in execution. Also check for corporate backing when looking at a library. This ensures the code will continue to be supported and updated.
In this chapter, we will look at jQuery (mature) and Vue.js (emerging/young).
For the purpose of this book, a JavaScript library is a single file that can be included with your code and provides several functions for your use. This differs from a framework, which is more opinionated on how you develop your entire site and relies on multiple files. Frameworks often provide both frontend and backend code. A JavaScript plugin extends a library to provide added functionality. Plugins rely on a library, whereas libraries are self-sufficient.
List of JavaScript Frameworks
List of JavaScript Libraries
Getting Started with a JavaScript Library
The standard is usually to download the library and move the files into your development folder. This process makes sense when you’re developing without an internet connection or if you’re creating a standalone website for an internal network. What makes the web so powerful is its inter-connectivity. So why not leverage this? Why don’t we just link to a host that already has the file so we have less to manage in our files and folders. But don’t just use any host, use a Content Delivery Network.
Content Delivery Networks (CDN)
CDN’s are servers that are typically used to host assets so that sites aren’t bogged down serving them. The advantage is that they are located all over the world, so if a user connects to your website, they can be served assets (images, videos, static code) from the server closest to them. We still need our own server for anything that’s dynamic, meaning anything that changes often. If you’re running a database, you can package what the user needs, while have them download assets elsewhere. The result is a quicker load time.
Another advantage of a CDN is caching. Let’s say your user visits a WordPress blog and is given the jQuery file from a CDN called Cloudflare. Then your user heads over to your site and you’ve linked to the same jQuery file on Cloudflare. The browser has already downloaded it, so there’s no point in downloading it