search

seek-oss / vocab

Vocab is a strongly typed internationalization framework for React
MIT License
129 stars 7 forks source link

Code split locale chunks per component/route #74

Closed OliverJAsh closed 5 days ago

OliverJAsh commented 2 years ago

(👋 Thanks for sharing this great tool!)

I have a handful of components, each with their own vocab folder. Each component is lazy loaded.

I am using VocabWebpackPlugin and I was hoping it would create a locale chunk for each component, but instead it seems to aggregate all translations into a single chunk. This means that users are forced to download all translations, even for components they may never actually see.

I suppose one difficulty in achieving this would be how to add the chunks to the HTML during SSR. Currently this is straightforward because there's only one chunk for the locale and it has a deterministic name, so we can just use the chunkName function, but if we split the locale chunk then this wouldn't be possible anymore.

jahredhope commented 1 year ago

Yeah, good call out. I agree that this would be nice. There are two axis to possibly chunk on: by language and by chunk. Only the former is supported.

How valuable it is to separate by chunks depends on how big your language catalog gets, in the use-cases I looked at it wasn't a very big benefit . Unlike splitting by language, that is often going to have a much larger benefit to being split out.

Ideally we could split by both axis where appropriate, ideally only splitting out when there is a non-trivial amount of translations.

OliverJAsh commented 1 year ago

We ended up building our own tool: https://github.com/unsplash/intlc

OliverJAsh commented 5 days ago

👋 I'm curious how you solved this?