Advanced customization

Automatic mode provides customization options:

• threshold: What is used to determine whether a component should be converted to Million.js. When the threshold increases, fewer components will be optimized, and vice versa.
• skip: An array of identifiers to indicate if a component should be skipped. You can add hook or variable names, function names, etc.

The auto object lets you configure options beyond the default ones set during installation:

 auto: {
    threshold: 0.05, // default: 0.1,
    skip: ['useBadHook', /badVariable/g], // default []
  }

import million from 'million/compiler';
 
/\*_ @type {import('next').NextConfig} _/
const nextConfig = {
reactStrictMode: true,
};
 
const millionConfig = {
{
  auto: {
    threshold: 0.05, // default: 0.1,
    skip: ['useBadHook', /badVariable/g], // default []
},
}
// if you're using RSC:
// auto: { rsc: true },
}
 
export default million.next(nextConfig, millionConfig);

Ignoring components

If you encounter an error with a component during the Million.js runtime, it can be skipped using the // million-ignore comment.

// million-ignore
function App() {
return ...
}

Muting help messages

To avoid seeing help messages, you can pass the mute: true option to the compiler inside the auto object.