vento icon indicating copy to clipboard operation
vento copied to clipboard

Add browser target

Open rougsig opened this issue 10 months ago • 5 comments

Currently, running Vento in the browser requires workarounds such as polyfills or using JSR to fetch raw TypeScript files and handling the build process on the bundler side.

rougsig avatar Feb 26 '25 16:02 rougsig

The core of Vento is easy to adapt for browsers. But there are other features that are more challenging, unless they are disabled for browsers:

  • Loaders: The default file loader of Vento use's Deno's filesystem functions to read files from the disk. We can disable loaders for browsers (to only render strings templates, but without include, layout or import tags) or create a specific loader for browsers that uses fetch.
  • Transformer: Vento uses some dependencies like meriyah to resolve automatically the variables (converting {{ varname }} to {{ it.varname }}). This feature can be removed for browsers, because it's just a syntax sugar, and it would reduce significantly the size of the library).
  • The default filters escape and unescape uses jsr:@std/html dependency. But this is a simple function that could be implemented directly in Vento so we can remove this dependency.

oscarotero avatar Feb 26 '25 16:02 oscarotero

  • would reduce significantly the size of the library

Will add Bundle size is 16.3 kB -> 5.94 kB (gzip) In reason of it tree-shakable and vento does not use the all meriyah lib.

Details here https://bundlejs.com/?q=meriyah%406.0.5&treeshake=%5B%7B+astring%2CESTree%2Cmeriyah%2Cwalker+%7D%5D

rougsig avatar Feb 26 '25 17:02 rougsig

And full vento size based on npm.

Fun fact Deno shim that does not needed for browser use more space that meriyah

Image

rougsig avatar Feb 26 '25 17:02 rougsig

Will add Bundle size is 16.3 kB -> 5.94 kB (gzip) In reason of it tree-shakable and vento does not use the all meriyah lib.

Ok, we can try, although 16Kb in browser is not so little.

oscarotero avatar Feb 26 '25 18:02 oscarotero

So i thought the best way to do it for now. It publish another npm package for browser. Because browser does not need deno shims, when nodejs need it.

rougsig avatar Mar 11 '25 14:03 rougsig

I close this because Vento 2 is 100% compatible with browsers without compilation.

oscarotero avatar Sep 13 '25 10:09 oscarotero