These are chat archives for ractivejs/ractive

29th
Aug 2017
kouts
@kouts
Aug 29 2017 15:10
Has anyone used webpack lazy loading with ractive components?
Thing is that I cannot have "nested" lazy loaded components because it seems that the components that reside deeper in the tree must be loaded first.
Has anyone encountered this?
Chris Reeves
@evs-chris
Aug 29 2017 15:16
I haven't tried nested yet - only one layer deep thus far. I'll try it out in a bit and see what shakes out.
kouts
@kouts
Aug 29 2017 15:20
I have setup ractive-bin-loader + babel-loader + CommonsChunkPlugin and works like a charm, but main bundle size is starting to get kinda big
so I'm searching for alternatives
Chris Reeves
@evs-chris
Aug 29 2017 15:22
are you externing ractive?
Joseph
@fskreuz
Aug 29 2017 15:23
Hmm... doesn't Ractive expect the entire tree to be present on load?
(unless you're doing something like anchoring)
kouts
@kouts
Aug 29 2017 15:26
If externing means it is outside of the bundle, yes
externals: { ractive: 'Ractive' },
@fskreuz I think yes, so there must be some way of deferring the init of the main Ractive instance until all components are loaded, right?
I'll check how others are handling this
Chris Reeves
@evs-chris
Aug 29 2017 15:42
Is the lazy loaded tree of components meant to be visible on initial render?
if not, a @shared or @.root guard could help e.g. {{#if @root.loaded.lazyThing}}...{{/if}} and import('path/to/LazyThing.ractive.html').then(cmp => { this.root.components.lazyThing = cmp; this.root.set('loaded.lazyThing', true); })
you can dynamically add components to the registry as long as you have no bound (i.e. they're in an unrendered conditional section) instances of them
kouts
@kouts
Aug 29 2017 15:47
@evs-chris yes it is meant to be visible but I'll try this example to see how it goes