Hi, I am currently writing my bachelor thesis about UI and Meteor. I want to make a summary about Blaze and templates, how it works and what components it uses. The best would be a schema about the components and how they interact between themselves. Thus, I need to get an overview how each element interacts. Even though I know how to program with Blaze/Templates/Spacebars, I have little idea about how exactly it happens.
First of all, where is Blaze ? If I got it right, in Meteor, Blaze is located in the package called “blaze-html-template”. Blaze-html-template is a :
meta-package that includes everything you need to compile and run Meteor templates with Spacebars and Blaze.
What is everything you need ?
According to which, blaze has three core elements :
1. Templating
Compiles Blaze Template files. So basically, it takes all head and body of HTML a HTML file and put them all together in highest parent HTML file (I guess, correct me if I am wrong).
Whenever the compiler find the following :
<template name="o">
//some code
</template>
It creates a Blaze Template which I guess is a javascript Object. (again, correct me if I am wrong). Or maybe is a JSON that gets parsed by javascript ?
2. Blaze
Ah, finaly we come closer :
Blaze is a powerful library for creating user interfaces by writing reactive HTML templates.
Details :
Blaze has two major parts:
- A template compiler that compiles template files into JavaScriptcode that runs against the Blaze runtime library.
May I ask what this Blaze runtime library is ? Google does not help with that one.
Moreover, Blaze provides a compiler toolchain (think LLVM) that can be used to support arbitrary template syntaxes.
Ok, so I can build my own Spacebars with that, but for us it is not important.
- A reactive DOM engine that builds and manages the DOM at runtime,
invoked via templates or directly from the app, which features
reactively updating regions, lists, and attributes; event
delegation; and many callbacks and hooks to aid the app developer.
Ok, really broad explanation. Sadly there is not explained in details on how this engine works. The rest of the documentation is basically an advert, not a documentation.
Packages
- blaze
- blaze-tools
- html-tools
- htmljs
- spacebars
- spacebars-compiler
So Blaze is a library and a package at the same time ? Maybe just FYI :
A library is a set of modules which makes sense to be together and that can be used in a program or another library.
A package is a unit of distribution that can contain a library or an executable or both. It’s a way to share your code with the community.
3. Spacebars
Spacebars is a Meteor template language…
This part easily understood, spacebars is the language with the bars like {{ #something }} and is uses Tracker and some Mongo functions. I guess that spacebars is only the language, Blaze is the one parsing and calling spacebars with different arguments.
What the documentation does not tell :
- How does Blaze work client side ?
- How does Blaze set up the UI ?
- How does Blaze read the files (the ordering might be important)
- How does Blaze create a data context ? (This is Blaze right ? or is it spacebars ? )
If anybody could help me in this mess, I just want an overview of what is going on. Meteor is nice for beginners, but there is a point in which you are forced to have advanced knowledge of the matter. And for that Meteor is terrible. (or Blaze, once again, it is not really clear).
Edit :
Also, the reason I need to know Blaze is to compare it to React and maybe evaluate which are the positive and negative points of both frameworks.
Edit n°2 :
Blaze | Meteor Guide for more information about Blaze