How ice.js 3 Redefines Frontend Performance with Parallel Loading and SSR Innovations

Loading Strategy

ice.js 3 does not separate MPA and SPA; instead it generates an HTML for each page that includes only the resources required by that page, avoiding duplicate loading of shared assets. During navigation, only the bundle specific to the next page is fetched, reducing redundant network requests.

Parallel Block and Data Loading

Layout components, page entry components, and data requests are loaded in parallel to achieve the fastest possible resource acquisition. For example, when navigating from /sales/recommends to /sales/favorites, the framework loads only the differing favorites.tsx component while reusing the already‑loaded layout components.

Rendering Strategy

Traditional CSR pages render a blank container initially, but ice.js 3 enables static HTML generation (SSG) so that the static part of a page is built at compile time, dramatically shortening white‑screen time. The framework also provides out‑of‑the‑box SSR, built on React 18 and Midway FaaS, with support for streaming rendering and Server Components. An ongoing exploration of “Zero‑Bundle‑Size” aims to eliminate client‑side JavaScript for components rendered on the server.

Multi‑End Development

ice.js 3 extends beyond PC to wireless and mini‑program platforms. Mini‑app configuration is demonstrated with a simple defineConfig and the @ice/plugin-miniapp plugin, allowing developers to define window and tabBar settings in src/app.ts. The framework also supports Alibaba (Taobao, DingTalk), WeChat, Baidu, ByteDance, and Kuaishou mini‑programs.

Runtime and Tooling

The default runtime uses React 18 and react‑router 6, offering a richer API surface and a convention‑based routing system. Build performance is boosted by swc for compilation and esbuild for server‑side builds. Configuration has moved from build.json to ice.config.mts, providing type‑checked configuration and easy plugin integration via defineConfig.

Future Directions

Upcoming work includes deeper integration of React Streaming and Server Components in business scenarios, a unified pre‑request model across terminals, and continued enhancements to the developer experience through lightweight native toolchains.

Relevant links: https://v3.ice.work/ https://github.com/alibaba/ice https://reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html