Speaking JavaScript (2014)
Part IV. Tips, Tools, and Libraries
Chapter 30. Libraries
This chapter covers JavaScript libraries. It first explains what shims and polyfills are, two special kinds of libraries. Then it lists a few core libraries. Lastly, it points to additional library-related resources.
Shims Versus Polyfills
Shims and polyfills are libraries that retrofit newer functionality on older JavaScript engines:
§ A shim is a library that brings a new API to an older environment, using only the means of that environment.
§ A polyfill is a shim for a browser API. It typically checks if a browser supports an API. If it doesn’t, the polyfill installs its own implementation. That allows you to use the API in either case. The term polyfill comes from a home improvement product; according to Remy Sharp:
Polyfilla is a UK product known as Spackling Paste in the US. With that in mind: think of the browsers as a wall with cracks in it. These [polyfills] help smooth out the cracks and give us a nice smooth wall of browsers to work with.
Examples include:
§ “HTML5 Cross Browser Polyfills”: A list compiled by Paul Irish.
§ es5-shim is a (nonpolyfill) shim that retrofits ECMAScript 5 features on ECMAScript 3 engines. It is purely language-related and makes just as much sense on Node.js as it does on browsers.
Four Language Libraries
The following libraries are quite established and close to the language. It is useful to be aware of them:
§ The ECMAScript Internationalization API helps with tasks related to internationalization: collation (sorting and searching strings), number formatting, and date and time formatting. The next section explains this API in more detail.
§ Underscore.js complements JavaScript’s relatively sparse standard library with tool functions for arrays, objects, functions, and more. As Underscore predates ECMAScript 5, there is some overlap with the standard library. That is, however, a feature: on older browsers, you get functionality that is normally ECMAScript-5-only; on ECMAScript 5, the relevant functions simply forward to the standard library.
§ Lo-Dash is an alternative implementation of the Underscore.js API, with a few additional features. Check out the website to find out if it suits you better than Underscore.js.
§ XRegExp is a regular expression library with several advanced features such as named captures and free-spacing (which allows you to spread out a regular expression across multiple lines and document per line). Behind the scenes, enhanced regular expressions are translated to normal regular expressions, meaning that you don’t pay a performance penalty for using XRegExp.
The ECMAScript Internationalization API
The ECMAScript Internationalization API is a standard JavaScript API that helps with tasks related to internationalization: collation (sorting and searching strings), number formatting, and date and time formatting. This section gives a brief overview and points you to more reading material.
The ECMAScript Internationalization API, Edition 1
The first edition of the API provides the following services:
§ Collation supports two scenarios: sorting a set of strings and searching within a set of strings. Collation is parameterized by locale and aware of Unicode.
§ Number formatting. Parameters include:
§ Style of formatting: decimal, currency (which one and how to refer to it is determined by other parameters), percent
§ Locale (directly specified or best fit, searched for via a matcher object)
§ Numbering system (Western digits, Arabic digits, Thai digits, etc.)
§ Precision: number of integer digits, fraction digits, significant digits
§ Grouping separators on or off
§ Date and time formatting. Parameters include:
§ What information to format and in which style (short, long, numeric, etc.)
§ A locale
§ A time zone
Most of the functionality is accessed via an object in the global variable Intl, but the API also augments the following methods:
§ String.prototype.localeCompare
§ Number.prototype.toLocaleString
§ Date.prototype.toLocaleString
§ Date.prototype.toLocaleDateString
§ Date.prototype.toLocaleTimeString
What Kind of Standard Is It?
The number of the standard “ECMAScript Internationalization API” (EIA) is ECMA-402. It is hosted by Ecma International, the association that also hosts EMCA-262, the ECMAScript language specification. Both standards are maintained by TC39. Therefore, EIA is as close to the language as you can get without being part of ECMA-262. The API has been designed to work with both ECMAScript 5 and ECMAScript 6. A set of conformance tests complements the standard and ensures that the various implementations of the API are compatible (ECMA-262 has a similar test suite).
When Can I Use It?
Most modern browsers already support it or are in the process of supporting it. David Storey has created a detailed compatibility table (indicating which browsers support which locales and more).
Further Reading
The specification of the ECMAScript Internationalization API is edited by Norbert Lindenberg. It is available in PDF, HTML, and EPUB format. Additionally, there are several comprehensive introductory articles:
§ “The ECMAScript Internationalization API” by Norbert Lindenberg
§ “ECMAScript Internationalization API” by David Storey
§ “Using the JavaScript Internationalization API” by Marcos Caceres
Directories for JavaScript Resources
This section describes sites that collect information on JavaScript resources. There are several kinds of such directories.
Following is a list of general directories for JavaScript:
§ “JavaScriptOO: Every JavaScript project you should be looking into”
§ JSDB: A collection of the best JavaScript libraries
§ JSter: A catalog of JavaScript libraries and tools for development
§ “Master List of HTML5, JavaScript, and CSS Resources”
Specialized directories include:
§ “Microjs: Fantastic Micro-Frameworks and Micro-libraries for Fun and Profit”
§ “Unheap: A tidy repository of jQuery plugins”
Obviously, you can always directly browse the registries of package managers:
§ npm (Node Packaged Modules)
§ Bower
Directories for CDNs (content delivery networks) and CDN content include:
§ jsDelivr: Free CDNs for JavaScript libraries, jQuery plug-ins, CSS frameworks, fonts, and more
§ “cdnjs: The missing CDN for JavaScript and CSS” (hosts less popular libraries)
ACKNOWLEDGMENTS
The following people contributed to this section: Kyle Simpson (@getify), Gildas Lormeau (@check_ca), Fredrik Sogaard (@fredrik_sogaard), Gene Loparco (@gloparco), Manuel Strehl (@m_strehl), and Elijah Manor (@elijahmanor).