BlockNote icon indicating copy to clipboard operation
BlockNote copied to clipboard

Bundle Size is really big, Better to get Rid of Mantine Lib and write our own code

Open ursnj opened this issue 1 year ago • 8 comments

Describe the bug

Bundle Size is really big, Better to get Rid of Mantine Lib and write our own code

To Reproduce

Build the project and see the output with and without blocknote.

Misc

  • Node version:
  • Package manager:
  • Browser:
  • [ ] I'm a sponsor and would appreciate if you could look into this sooner than later 💖

ursnj avatar Jul 30 '23 16:07 ursnj

@ursnj I think this is good feedback. It would make sense to extract the Mantine code, and make it available as a separate package (e.g.: blocknote-react-mantine).

We could then also support different UI frameworks in different packages. Would be interesting to hear what UI libraries people might be interested in. For example:

  • React Spectrum / React Aria: https://react-spectrum.adobe.com/
  • Ariakit: https://ariakit.org/
  • Headless UI: https://headlessui.com/
  • ...

Imo these would also be great candidates for the community to collaborate on!

YousefED avatar Jul 30 '23 19:07 YousefED

I'm vote for changing to either React Spectrum or Ariakit...

the main issue here I believe is balance supporting a cleaner and accessible solution and a headless/no styles solution for folks who want to adapt to their app styles...

not sure what is the best approach yet..

horacioh avatar Jul 30 '23 19:07 horacioh

@YousefED Shadcn also promising in this kind of cases, as it exposes independent components and fully accesible, we can only bundle the components we are using so it will be more independent and bundle size is absolutely lean.

https://ui.shadcn.com/

ursnj avatar Aug 06 '23 12:08 ursnj

yeah shadcn is ideal imo

NiluK avatar Aug 07 '23 16:08 NiluK

I think shadcn is cool

gooooooooney avatar Aug 11 '23 04:08 gooooooooney

shadcn would be the best for this type of application

meetshukla avatar Aug 29 '23 02:08 meetshukla

+1 for this 👍 shadcn is awesome

florisbosch avatar Sep 16 '23 23:09 florisbosch

It seems that chadcn is the most popular answer here. I would like to understand how are you using it in your apps? because as far as I know this is not a real NPM UI Library but a set of "examples" you need to copy paste into your app.

am I missing something?

horacioh avatar Oct 23 '23 11:10 horacioh