Dinou docs

Automatic Memoization

Dinou comes with the React Compiler enabled by default. This compiler analyzes your code and automatically memoizes values and functions, preventing unnecessary re-renders without forcing you to manually manage dependencies.

Cleaner Codebase

Write plain JavaScript logic. No need to clutter your components with hooks just for performance optimization.

Runtime Performance

The compiler applies fine-grained memoization, often outperforming manual optimization by understanding the data flow deeply.

Code Comparison

You can simply write standard React code, and Dinou handles the rest.

// ❌ The Old Way (Manual Optimization)
function ExpensiveComponent({ data }) {
  // Manual memoization required to prevent recalc
  const processed = useMemo(() => heavyMath(data), [data]);
  
  // Manual callback to keep reference stable
  const handleClick = useCallback(() => {
    console.log(processed);
  }, [processed]);

  return <Child onAction={handleClick} />;
}

// ✅ The Dinou Way (React Compiler)
function ExpensiveComponent({ data }) {
  // ✨ Automatically memoized by the compiler
  const processed = heavyMath(data);
  
  // ✨ Automatically stable reference
  const handleClick = () => {
    console.log(processed);
  };

  return <Child onAction={handleClick} />;
}

Bundler Integration strategy

Dinou uses a sophisticated hybrid bundling strategy to ensure the bestDeveloper Experience (DX) during development while ensuring maximum optimization for Production.

Configuration Matrix

Webpack

Dev: Enabled

Prod: Enabled

Rollup

Dev: Enabled

Prod: Enabled

HYBRID

Esbuild

Dev: Native Speed

Prod: Enabled

Why isn't it enabled for Esbuild Dev?

In development mode with Esbuild, our priority is instant HMR (Hot Module Replacement). Since the React Compiler requires an AST transformation via Babel, adding it would slow down the sub-millisecond updates of Esbuild.

We disable it in dev to keep your iteration cycle instant, but we automatically enable it during the production build so your users get the fully optimized version.