fu·sion — noun
The process or result of joining two or more things together to form a single entity.
Fusion.js, Uber’s open source universal web framework, represents the fusion of the client and the server. We built Fusion.js from the ground up to provide out-of-the-box support for features like universal rendering, static typing, and code splitting, and to reflect today’s best practices in web development.
If you are new to Fusion.js, Core Concepts and the Learning Fusion.js Tutorial are a great jumping off point to learn what Fusion.js is and to get some hands on experience.
Once you are more familiar with the framework, Recipes details how to accomplish common tasks related to web development in Fusion.js and Testing dives into the utilities and libraries that Fusion.js provides as well as details general strategies and tips on debugging.
References dives deeper into specific parts of Fusion.js and the API docs is a great way to learn all about the many plugins in the Fusion.js ecosystem.
Fusion.js’s plugin-based architecture addresses the challenge of building modern web applications within an ever-changing landscape. Because plugins are self-contained entities with their own set of dependencies, APIs, and middleware, application code is nicely encapsulated, making it easy to fix bugs, add new features, and upgrade services.
Because Fusion.js applications are universal, which means that apps have a single entry point, all code from React components to middlewares in Fusion.js plugins by default runs on both the server and browser. This means that your code can be reused across the server and browser, and if needed, you can easily separate out business logic with __NODE__ or __BROWSER__ variables.
const app = new App();
// This plugin is universal and works across both environments
app.register(LoggingPlugin);
// These plugins ONLY work on the server
if (__NODE__) {
app.register(FileSystemPlugin);
}
// These plugins ONLY work on the browser
if (__BROWSER__) {
app.register(BrowserApiPlugin);
}With universal rendering, your applications will benefit from performance gains like faster initial page load and reduced bandwidth consumption. You also have the flexibility to define what renders on the server and browser with code splitting.
We built Fusion.js to be a lightweight but high-performing system:
To counteract the extensive mocking required to test applications in Express, Fusion.js plugins leverage dependency injection, meaning they can expose well-defined APIs as services to other plugins, and a plugin’s dependencies can easily be mocked during tests. This also ensures that dependencies are type safe with support for Flow. Built-in Fusion.js simulation, snapshot, and integration testing provide further support to help you write quality apps.
test('example test', async t => {
const app = await main();
app.register(LoggerToken, MockLogger);
// Continue with test
});Fusion.js comes with support for: