SPA builder Sun Jan 03 2021

7 points which make imorph a modern website builder

By: Prasenjit Paul

Thought imorph is not just a website builder; rather a unique combination of backend infrastructure and frontend builder; but in this article, we are going to describe the frontend builder part, which is undoubtedly one of the best achievements of us.

SPA Builder

When many other website builders are providing tools to build web-pages that will be loaded from the server with every navigation; imorph is helping you to build a single-page application.
A single-page application is a website that doesn’t reload fully while navigating through pages. Rather it uses minimal communication with the server to keep the user experience rich.
Here is a video of a demo site, which is built with imorph. You can see how fast and near-instant the page navigation is.

The SPA is built with vue.js and nuxt.js and the templates work as-is. You can use nuxt-to, {{'aValue'}}, @click=myFunc, :attr=myVal and other vue/nuxt properties.

Master pages

Any business website has a design language. Many of its pages have a similar header, footer, and other components. Creating these layouts for every page is a painful task. Things become more frustrating when you need to update multiple pages.

Fortunately, imorph has the feature of creating master pages. You can compare it with layouts of nuxt.

You can create a master page and place a placeholder widget somewhere. Any page having that page as master will populate all the given designs. Whenever you update something on the master, it will auto-populate the changes in the child (provided the child is published).

Intelligent SSR

In a SOAP application, or more specifically a non-single-page application, everything comes from the server. But single-page applications are generally client-side running applications. This is why it generally has issues with SEO.

However, a site built with imorph, not only gives your user the rich experience of a single-page application but also takes care of server-side rendering, which ensures the tags and content is being served to google and other crawlers.

Suppose you have created a page (say product details page) in your imorph website, and have used product-details widget (and maybe some other widgets as well) in it. Now when that page is requested from a browser or any other client, imorph’s servers understand that there are some components or widget which needs some data upfront. Hence it fetches the data on the server itself and renders the widgets accordingly with appropriate data and eventually served as a full of content page.

This feature is also one of the reasons why the website loads faster in the browser. As many tasks are done in the server itself, there are only fewer tasks left to be done in the user’s device.

On top of bootstrap

While the majority of the website builders out there asks you to provide properties of each element; imorph’s builder gives you the flexibility to be into bootstrap’s ecosystem.
You can use bootstrap classes to style any element and hence the entire website. For any override, definitely, the feature of custom CSS is also there.

Automatic caching

Having intelligent caching techniques at multiple levels helps imorph to decide when to cache how much and where.

Extensive shopify response caching along with template compilation helps the site to be served blazing fast. Reuse of cached data from the browser makes the browsing experience even better.

Forcing the best practices

Following programming principals is one of the most effective but underrated things in the engineering world.
There are always to ways to build a feature. First is the quick way, second is the right way. As the human brain always tend to prefer the first, we often ignore the second and hence make development painful in the long run.

The design principles of imorph force the best practices on the person who is developing a website using it. For example, imorph ensures there are absolutely no user-specific data calculations in server-side rendering; cause it needs to be cached. Communications are only allowed by publishing and listening to events so that everything remains non-blocking.

Miscellanies

Apart from the 6 points mentioned above, there are multiple features available, which enables you to build a modern, fast performant and managed website easily. Here are some of them.