Today everyone knows the importance of a lightning-fast website and how the speed impacts the conversion rate of a business. Today, everyone wants the site to be a PWA so that the mobile users can have an app-like experience with the website because, for the majority of the merchants, the customers come through mobile devices.

I still remember the days when we used to build traditional asp.net websites back then during 2010/12. Must admit that web technologies have come a long way, and all thanks to the great javascript frameworks like Angular, Ember, React & Vue.

Where we stand today

Covid-19 has definitely made human life miserable. However, this has also been a trigger point for many businesses to accelerate themselves.
It’s almost visible now that everyone is talking about online businesses, online brand building, online marketing, etc. Sectors like Ed-tech & e-commerce have seen some game-changing opportunities. Many ed-tech companies have become unicorns this year and many merchants started focusing on their own brands online, rather than just depending on Amazon.

Be it ed-tech, e-commerce, hospitality, travel, or any other sector; to go online they either use some ready-made cloud SAAS (software as a service) platforms or build custom solutions.

If the business is using its own custom-built software solutions, then it achieves the highest level of tech flexibility. However, building custom solution and maintaining an engineering team costs big to your pocket.
On the other hand, there are many cloud SAAS solutions that take nearly all the engineering responsibilities and enable a non-engineering team to manage their online businesses. This is highly cost-effective and reduces management headache, but often fails to provide a high degree of flexibility to brand yourself and to leverage the technologies which are not yet supported by it.

For example, an e-commerce merchant can create his store using Shopify and install different themes. But as the world has started moving into headless technologies, if the merchant also wants to make a headless store then he is forced to hire a development team or an agency that will make this for him.
This is the problem that imorph is solving by its ability to create vuejs application on the fly with drag and drop and minimal coding requirements.

imorph from a developer’s angle

There are two key parts in a single-page application. First is, when the user navigates through different pages, it knows which parts are to be rerendered and which to keep as is. The second is the server-side rendering for SEO.

Routes

In a traditional site builder, it is easier to create pages cause every request is going to hit the server and get the entire piece of HTML. However, for a dynamic headless website builder like imorph, the challenge is, for the same page, it can either be rendered from server-side or from client-side, and in both the cases the approach is going to be different.
To solve this problem, imorph has created its own route handler; using which, whenever a particular route is hit, imorph knows what exactly is the requirement of the requested page. Is there some data that can be picked from the previous pages, or should it get that tiny product info from Shopify, or it needs to fetch more data and templates to do an SSR; imorph tries to take action based on all these questions and eventually does the needful to serve the appropriate page to the user in the most efficient way.

Layouts & Pages

At the end, imorph provides an interface to the developer or the site admin where they can create master pages, which are equivalent to layouts in nuxt.
Just like the layouts in nuxt has <nuxt /> and <router /> etc., in imorph’s master pages you get placeholder widget.
If you are creating a page using a master page in imorph, you will be able to add more widgets and components to the placeholder section.
Now if you create 5 pages using a certain master page, and you need to change something for all those pages; you just need to do it on the master page. All common components like header, footer, popups, etc can go inside the master page.

Developer options

Though imorph provides ways to build a page and makes the site functional by predefined configurable widgets, as we all know there is always a scope for custom requirements.
In vue.js or any other javascript framework, we generally communicate through events. Similarly, imorph also provides its own event hooks using which you can publish and listen to different events and play around.
There are ways to provide both static and API-based data for both client-side and as well as for server-side rendering.
Developers can also handle things like 301 redirect and language-related modifications easily.

How much is imorph providing

The core idea is not to compete with VueJS coding. The idea is also not about giving only hosting.
The mission is to drastically reduce the effort of developing a site. At the core, imorph is providing readymade widgets and functionalities as an abstraction to the core feature development. Here are a few of the core features it is giving out of the box.

1. Dynamic SPA - You can create your single page application with multiple pages, layouts, components etc. with mere drag and drop.
2. SSR - Based on different components you used while creating the site, imorph does the SSR.
3. Events - You can write code to listen to different events like add-to-cart, you can also publish some to communicate through imorph’s event bus.
4. Data sources - You can fetch data from different API endpoints and make the response available to your application. This can also be done while doing SSR.
5. Versions - Just like you create new branches in git to develop new pages, you can also create versions of each page in imorph.
6. Hosted - The solution is fully hosted and cached through CDNs.

How does the future of PWA look like

When modern browsers like Firefox & Chrome appeared in the market, they were being projected as the fast browsers. Eventually, when people started using them, they become habituated with the speed and could not go back to Internet Explorer anymore.
I feel similar with PWA as well. PWA sites are lightning fast now. Once the major user base becomes habituated, all websites will be forced to move into PWA architectures.
Even google trend has started showing a boost in keywords like headless & headless commerce.

Currently building a headless site requires resources and is costlier than a traditional website. Once players like imorph start penetrating the market, it will become easier for the site owners to move into the new technology and a faster internet ecosystem will become a reality.