Mosaic v0.6.0

Version 0.6.0 of Mosaic comes with a lot of new changes! Most of these changes do not necessarily require a massive rewrite of existing Mosaic apps.

Use of Web Components

Mosaic now uses web components! Each time you call "new Mosaic" you are creating and returning a new instance of a custom element. Composing elements no longer involves using the "${ }" syntax. Instead, you now write "</custom-component".

new Mosaic({
   name: 'my-label',
   view() { return html`<p>This is a label</p>` }
});

new Mosaic({
   name: 'my-app',
   view() {
      return html`<div>
         <my-label></my-label>
      </div>`
   }
})

New "name" property

Because Mosaic now uses web components, it was necessary to add a new property to the Mosaic constructor. "Name" is now required and is used to specify what the developer would like to name their custom element.

Better Array Patching and Mosaic.list

Version 0.6.0 introduces a better array patching algorithm than in the previous version. In addition to better patching, you can no longer use arrays directly in the view function. You are now required to use "Mosaic.list" in order to enforce efficient rendering.

Router is also a Web Component

The Mosaic Router is now its own web component. Also removed the ability to set multiple components on one route.

Paint function changes

As of right now, the ability to pass data and an injection DOM node to the paint function has been temporarily removed.