LiveDuo / destack

Page builder for Next.js 🅧. Zero-config deployment 🚀. React now supported!
MIT License
1.62k stars 326 forks source link

start Migration to typescript #14

Closed iojcde closed 3 years ago

iojcde commented 3 years ago

Typescript will help prevent future bugs, and will be useful anyways while developing. This PR will also dynamically load components for the grapesjs editor, which improves speed vastly.

The contentprovider component used to be over 200kbs, but now is only 3.4kbs.

iojcde commented 3 years ago

Shoot I forgot that I removed the part that injects tailwind from a cdn in the library..

In this pr it removes those and the user has to install tailwind themselves.

Actually, it might be a better Idea to give the user a choice.. use tailwind from cdn if they're lazy, or install tailwind themselves for better performance.

There isn't any way to trigger postcss(in nextjs) to run without creating a postcss config file in the users nextjs app as far as I know. (tailwind is a postcss plugin)

iojcde commented 3 years ago

image Right is before, Left is after this pr. Massive improvement because it doesn't load all the components for the grapejs editor in production mode.

iojcde commented 3 years ago

Hmm, this doesn't seem to work with blitz.js very well..

Blitzjs's webpack isn't recognizing the grapes. Min-(hash).js as. Js file for some reason

LiveDuo commented 3 years ago

Hmm, this doesn't seem to work with blitz.js very well..

Blitzjs's webpack isn't recognizing the grapes. Min-(hash).js as. Js file for some reason

That's strange. I thought blitzjs was built on Next.js.

LiveDuo commented 3 years ago

image Right is before, Left is after this pr. Massive improvement because it doesn't load all the components for the grapejs editor in production mode.

Forgot to say. That improvement is huge! It makes attractive to SEO people and better position when the blogging system is ready!

iojcde commented 3 years ago

Yep! It used to load ALL of the tailblocks components even in production. We were just loading 250+kbs of unused code.

I just made it dynamically load grapes.js using es2020 dynamic imports.

LiveDuo commented 3 years ago

I was thinking about TailwindCSS integration and what's the best way to go forward with it. For the time being it might be better to seperate Tailwind changes into a seperate PR.

There are a few things to consider further before moving on with that change. On the other hand Typescript support seems good to go. Same with dynamically loading Grapes.js!

iojcde commented 3 years ago

I think we should add.tsbuildinfo (and lib/destack/.tsbuildinfo) and .vscode to .gitignore. Some like to have VSCode config commited into the repo to have a consistent work environment but since it's an open source project it might be better to let contributors choose their own config.

Thanks!

iojcde commented 3 years ago

see #18