React

When building WebApps for Sitevision, React is our preferred framework for creating dynamic and interactive user experiences. However, to optimize performance and minimize redundant resource loading, it’s crucial to share a single React instance across all WebApps. This is achieved by defining the required React version in the app’s manifest.json.

By leveraging shared React, developers can significantly reduce page load size, improve browser performance, and maintain compatibility across multiple WebApps.

Why Sharing React Matters

Including a standalone version of React in every WebApp results in duplicate resources being loaded when multiple WebApps are used simultaneously. This not only increases page weight but also leads to inefficiencies in memory usage and performance. By using a shared React instance, we avoid redundancy while ensuring all apps have access to the framework they need.

Setting React in manifest.json

To enable shared React in your WebApp, you must declare the required version of React in the manifest.json file. Here’s a sample configuration:

This makes sure you have the right version of React and ReactDOM provided when rendering the app. Sitevision will always provide the latest patch for each minor.

Best Practices for Using Shared React

• Version Consistency: Ensure the React version you declare aligns between your apps. Since specifying different React version in different WebApps on the same page will slow your page down.
• Testing: Test your WebApp thoroughly in the Sitevision environment to confirm compatibility with the shared React instance.

By specifying your WebApp’s React requirements in manifest.json, you contribute to a more streamlined and efficient Sitevision environment. Sharing React not only enhances performance but also simplifies maintenance, creating a better experience for both developers and end-users. Adopting this approach ensures that your WebApps remain lightweight, fast, and compatible within the Sitevision ecosystem.