Skip to main content

Using the AOT compiler

@lirx/dom embeds a JIT compiler to convert on-the-fly the reactive-html templates and reactive-css styles of our components.

However, it has been build from the beginning to be able to pre-compile these templates and styles, through an AOT compiler.

This permits to remove entirely the JIT compiler, saving space, and the necessity to parse and compile these files on runtime, increasing drastically the performances.

So using the @lirx/dom-aot-plugin is strongly recommended. We can install it using the command:

npm install @lirx/dom-aot-plugin -D

Then, we'll have to update the vite.config.js file to enable these optimizations:

vite.config.js
// import the AOT plugin
import { aotPlugin } from '@lirx/dom-aot-plugin';

const config = {
  // ...
  plugins: [
    aotPlugin(),
  ],
  // ...
};

export default config;

Now, when running yarn run dev or yarn run build, the plugin will optimize automatically our components.