Facebook JavaScript (FBJS) is a JavaScript library developed by Facebook to power the frontend of Facebook web applications. It provides utilities and abstractions over vanilla JS to enable building complex web apps easier and faster.
Why was FBJS created?
Facebook engineers realized they needed a standard library to eliminate redundant code across web projects. FBJS was created to:
- Standardize common JavaScript tasks like DOM manipulation, AJAX requests, state management, etc.
- Improve developer productivity by providing reusable utilities
- Enforce best practices like immutable data, declarative APIs, etc.
By consolidating these common needs into a single library, FBJS enabled Facebook developers to write frontends more efficiently at scale.
What major features does FBJS provide?
FBJS provides a variety of utilities across these categories:
- DOM Manipulation – Functions to select, create, update DOM nodes
- AJAX – Wrappers for XMLHttpRequest and Fetch APIs
- State Management – Utilities to manage data flow
- Rendering – Abstractions over React/Preact for declarative UIs
- Data Structures – Immutable data structures like Map, List, Set
- Internationalization – Tools for i18n and l10n
- Storage – Wrapper over localStorage API
- Polyfills – Backfills for unsupported browser APIs
Beyond these categories, FBJS also provides miscellaneous helpers for tasks like throttling, debouncing, benchmarking, etc.
How does FBJS compare to other JS libraries?
FBJS is most similar to “standard library” projects like Lodash, Underscore or Ramda. It provides lower-level utilities compared to monolithic frameworks like jQuery, React or Angular.
Some key differences between FBJS and other standard libraries:
| FBJS | Lodash / Underscore |
|---|---|
| Heavily optimized for performance | Less focus on perf optimizations |
| Utilities tailored for web apps | More generic utility functions |
| Emphasis on immutability | Mostly mutative methods |
| Integrated with React abstractions | Framework-agnostic |
So in summary, FBJS provides a web-focused standard library designed specifically for Facebook’s needs.
How is FBJS used at Facebook?
Nearly all frontend code at Facebook imports and uses FBJS in some capacity. Some example usage:
- Selecting/manipulating DOM nodes
- Making GraphQL queries
- Updating React component state
- Storing data in immutable structures
- Calling i18n functions
- Throttling function calls
FBJS provides the shared foundation for Facebook’s web architecture. Major products like Facebook.com, Messenger, Instagram, etc all leverage FBJS.
What major projects use FBJS?
FBJS powers the frontend for many popular Facebook projects:
- facebook.com – Facebook’s main website
- Messenger.com – Facebook Messenger website
- Instagram.com – Instagram website
- Workplace.com – Facebook’s enterprise platform
- Oculus.com – Oculus VR hardware
- Bulletin.com – Facebook’s news aggregator
Many other internal web tools and open source projects also use FBJS extensively.
Is FBJS open source?
Yes, FBJS source code is available on GitHub under the MIT license at github.com/facebook/fbjs.
It is open source so anyone can inspect the code, submit issues, or create pull requests. FBJS also publishes changelog notes for each release.
What is the future of FBJS?
FBJS development is closely aligned with Facebook’s web frontend needs. Some areas of future exploration include:
- Improved mobile performance
- Isomorphic rendering
- TypeScript support
- Enhanced React integrations
- Expanded Internationalization
The core utilities will continue evolving as JavaScript language features progress. FBJS aims to leverage new capabilities while maintaining wide browser support.
Conclusion
Facebook JavaScript (FBJS) is a utility library that powers web development across Facebook’s products and services. It enables building complex web UIs through abstractions over common frontend tasks like DOM manipulation, AJAX requests, state management, and more.
FBJS improves developer productivity and enforces best practices for React-based web architecture. Its utilities are optimized for performance and tailored to Facebook’s specific needs.
As an open source project designed specifically for scaling Facebook’s massive web codebase, FBJS serves as an interesting case study for building shared JavaScript foundations.