v4.0.0

Switch from Babel to TypeScript

New Template Compiler and Optimizer plugin is using TypeScript library to parse javascript. Switching to TypeScript as a parser library should reduce the number of dev dependencies in modern projects.

DOM Events Hoisting

DOM Events declared as an arrow function expression will be automatically hoisted to the outermost scope. E.g.

const C = component((c) => ([a, b]) => html`
  <div
   @a=${() => console.log(global);}
   @b=${() => console.log(c);}
   @c=${() => console.log(a + b + c);}
  />
`);

Will be transformed into:

const __ivi_hoisted_1 = () => console.log(global);;
const C = component((c) => {
  const __ivi_hoisted_2 = () => console.log(c);
  return ([a, b]) => html`
    <div
     @a=${__ivi_hoisted_1}
     @b=${__ivi_hoisted_2}
     @c=${() => console.log(a + b + c);}
    />
  `;
);

Component Render Function Hoisting

Render functions in simple components that has a pattern component(() => (...) => ..., ...) will be automatically hoisted to the outermost scope. E.g.

const C = component(
  (c) => ({ text }) => text,
  shallowEq,
);

Will be transformed into:

const __ivi_hoisted_1 = ({ text }) => text;
const C = component(
  (c) => __ivi_hoisted_1,
  shallowEq,
);

@ivi/tpl syntax is removed

• @ivi/tpl and @ivi/htm packages are removed.
• Template functions for HTML-like syntax are now part of the ivi package.

SSR/Hydration is removed