Features

Routers & SEO

Routers, switches and components. It's quite complicated but it's a complexity that is needed to be able to build the most flexible websites. Most website builder platforms are MPAs (Multi Page Applications), whereas WebDigital websites are SPAs (Single Page Applications). On MPA websites, you can add a page and that page usually has a route. The page may even correspond to a file name like <domain>/test-page.html. At first glance, this may feel simple and desirable but upon further inspection the problems of this approach becomes clear.

• Repeated Sections: MPAs output the entire HTML of the route. If you have some sections repeated between different pages (like a menu bar, header, footer, etc.) they get re-rendered with every page change. They get re-fetched from the server for every request, even though the browser got them in the previous request. Similar problem for sub-routes and components. You may wish to have common sections across different pages and in most cases you will have to repeat them. If you need changes in one, you will have to do them all.
• Route Transitions: MPA architecture also makes it impossible to transition between different routes. At best what you can do is fade out, load new page and have it fade in, but on slower networks this approach results in an undesirable experience.
• Loss of State: Another problem with MPA is the loss of state. Every time a new page is loaded, previous page's JavaScript data in memory will be gone. Depending on your website, this may be a major problem.

WebDigital solves these problems by using routers, switches and components in SPA architecture. Routers basically look at one part of a route and decide which component to display based on their configuration (routes). Routers will have a root route, which gets displayed if there is no route. It is followed by a set of custom routes that can be configured to show components or redirect if needed. Finally, it ends with the default route, which determines what to do if none of the routes are matched. Similar logic to React Router.

Switches are similar to routers but they work from the state instead of the route. Components are basically content modules combined with CSS, font and file references and they can be re-rendered anywhere on the website, multiple times if needed. With this architecture, you can even setup sub-routes. SEO works like React Helmet: all components can have SEO tags but the last component to be rendered will have the final values for the route. WebDigital also provides a dynamic and recursive editor for schemas. Many platforms ask you to use a third party for that.