Meteor Template Loader

The one and only template loader you need! Allows to import Templates dynamically at lookup-time. All code < 200 lines.

How it works

Blaze usually requires a Template to exist when looking it up to render it's content to the DOM. However, a Blaze.View is constructed reactively, waiting for the template instance to be created, first.

This mechanism can be exploited in order to "wait" until the Template is imported and from there run like with any other Template.

Installation and usage

Install this package via

$ meteor add jkuester:template-loader

Then import it anywhere soon in your client startup order and add the Templates that are common to be loaded dynamically.

However, you need to initialize it once beforehand, otherwise there won't be any interception of the Template lookup/include mechanism.

Consider the following example:

client/main.js

1import { TemplateLoader } from 'meteor/jkuester:template-loader'
2
3TemplateLoader.enable()
4    .register('myForm', async () => import('../path/to/myForm'))
5    .register('myList', async () => import('../path/to/myList'))
6    .register('myUser', async () => import('../path/to/myUser'))
7    .register('myCard', async () => {
8      const { dependency } = await import('../path/to/dependency')
9      const { cardExport } = await import('../path/to/myCard')
10      return  cardExport.inject(dependency)
11    })

All these Templates are now automatically loaded via the given loader function. As you can see, the operation is chainable and you can also include complex import logic into the loader function.

Note, the Templates will not be imported before there is no other Template, that includes them in it's HTML/SpaceBars code (or until it is manually imported).

You can add more Templates to autoload at any time.

Do not add the import function directly or it will trigger the import immediately and that would defy the purpose of this package:

1// XXX DO NOT DO IT LIKE THIS
2TemplateLoader.register('myForm', import('../path/to/myForm'))

Why do I want this?

Once your application bundle grows beyond 1MB (which can happen very fast!) you need to consider dynamic imports to reduce initial bundle size.

A large initial bundle will rapidly delay the time to interact and may shut out users with lower bandwidth. By dynamically importing Templates you can ensure to deliver complex applications with great speed.

Contribution