Skip to content

Conversation

oscarotero
Copy link
Contributor

@oscarotero oscarotero commented Sep 3, 2025

This PR upgrades the codebase to Lume 3 and introduces some improvements:

  • Use folder components for those components that require JavaScript in the browser.
  • All *.client.js files have been moved to a subdirectory and the .client sub-extension has removed since is not needed in Lume 3
  • Used Tailwind alone instead of Postcss + Tailwind.
  • Lume 3 has a debugbar with useful info (you can see it moving the cursor to the bottom of the window). It can be configured to show broken links or any other output. This is what I see in my computer:
    imaxe
    • It looks like the layout rendering is what takes more time. Maybe replacing the .tsx files with a faster format like Vento would help to reduce the time.
    • Saving files takes also a significant amount of time, but I don't know how to optimize this process. It may be an inherent limitation of Deno?

This PR is in draft because while I was working on this, I discover a couple of bugs in Lume (that's why I'm using a dev version). I'll ship these changes soon and will update this PR with a stable version.
Edit: Lume 3.0.8 is already published

@marvinhagemeister
Copy link
Contributor

Setting compilerOptions.jsx to precompile should noticeably speed up rendering.

  // deno.json
  {
    "compilerOptions": {
      "types": [
        "lume/types.ts"
      ],
-     "jsx": "react-jsx",
+     "jsx": "precompile",
      "jsxImportSource": "npm:preact"
    },
  }

@oscarotero
Copy link
Contributor Author

@marvinhagemeister Good point! I just changed it and the rendering time for layouts is now 6.5 sec (200% faster). My computer is old (iMac from 2015) and probably it's faster on you side.

@oscarotero oscarotero marked this pull request as ready for review September 4, 2025 15:47
@oscarotero
Copy link
Contributor Author

I have updated this PR with the latest changes and all conflicts are resolved.
The only thing that doesn't work is the jsr:@orama/[email protected] compilation. I got the following error:

"node:crypto", imported by /Users/oscarotero/www/docs/node_modules/.deno/@[email protected]/node_modules/@noble/hashes/cryptoNode.js is a Node.js built-in module and won't work in the browser.

One of the changes of Lume 3 is the use of deno/loader for esbuild instead of relying on esm.sh. Do you know if there's a way to use a polyfill for node: specifiers?

@marvinhagemeister
Copy link
Contributor

It's probably better to use the npm package rather than the jsr one. The npm package ships with various entry points for browsers, deno and other runtimes. Such a feature doesn't exist on JSR.

@oscarotero
Copy link
Contributor Author

NPM has the same error.
I finally fixed it using an alias 22b6a31

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants