SPA or PWA or Serverless

132 views
SPA or PWA or Serverless

Every day, web applications are becoming more and more popular due to their attractiveness and efficiency. Users are drawn to these factors and many of them have begun to choose applications instead of websites.

Based on personal observations and experience, I want to share my vision: modern tools that help create web applications faster and better overall.

Single page application (SPA)

Single Page Application (SPA) is a web application whose components are loaded once on one page, and content is uploaded as needed from there on. When switching between sections of the application, the page does not reload completely, but instead, only the data is loaded and the necessary information is displayed.

This is clearly demonstrated in the work of well-known SPA applications like Gmail and Netflix.

Gmail as example of SPA

SPA work is performed inside the browser, and the code is rendered on the user side. This is a big advantage, as well as a big disadvantage at the same time. The disadvantage would be the possibility that the SPA could overload the browser.

Single-page applications greatly benefit from the speed and usability of classic web-based applications.

A few years ago, single-page applications almost did not support search engine optimization and they were used mainly for creating personal accounts and administration panels. However, today a developer can easily create a one-page application with full support for search engine optimization (SEO). You can create an HTML page ready for display and search engines get pages ready with all meta-information and semantic markup.

Here are a few examples where the development or transition to SPA is appropriate and justified:

If you have an old application that is outdated and running slowly, then you can safely update the application to a quick one-page app because technologies already allow you to do this quickly and efficiently.

SPA can be used for social networks, aggregators, SaaS platforms, and marketplaces.

However,you need to consider the flaws:

You cannot create a SPA if your target audience does not use modern browsers and devices.

Do not rush to create SPA for specific corporate areas, such as the development of internal systems for banks, medical institutions, or education institutions.

You can opt out of an SPA if you have a good website or online store that sells well.

But the main reason to abandon SPA is PWA.

Progressive web applications (PWA)

PWAs (Progressive Web Apps) are websites built on web technologies using JavaScript, HTML, and CSS that interact with the visitor as applications. They can send push notifications. PWAs work without an internet connection. In this case, the user does not need to download the native application from the AppStore or Google Play, but simply save the app to a desktop.

Some real examples.

After launching a new site with PWA support, Best Western River North was able to increase revenue by 300%.
After creating support for PWA on its website, OpenSooq increased the time it took to visit the site by 25% and the number of leads by 260%.
Tinder reduced the download speed from 11.91s to 4.69s by developing PWA. Moreover, the application’s download time is 90% less than its native Android counterpart.
Magento launched the early development version of PWA Studio in 2018. The platform allows “out of the box” to create a frontend based on React for its e-commerce solutions with PWA support.

Professional advice! If you have an idea for a new web service with support for mobile devices, first look at PWA technology. This could be the best solution in terms of price and quality.

PWA will be faster than the original application.

There are push notifications.

Cross-platform.

Minimum device resource requirements.

PWA has far fewer security issues since all connections must pass through a secure HTTPS source.

In PWA, everything is good for SEO.

We will say that if PWA has one drawback, it is the cost. The cost of developing PWA at the site development level ($ 2,000-20,000). PWAs are best suited for companies targeting both websites and mobile platforms. If you decide to focus on only one of them, there is no reason to choose the progressive development of web applications.

Also, advanced web applications do not work with proximity sensors, advanced camera controls, recording audio or video, fingerprint scanning, NFC, or even Bluetooth.

Ask your development team for a checklist of PWA features that they cannot implement. If you can not do without even one of these functions, you should choose mobile development and separately create a regular site.

However, PWA is becoming a trend in web development and will continue to growin the near future. In addition, in the Audit Chrome DevTools tab, you’ll find Lighthouse for PWA.

Lighthouse Chrome devtools PWA

Serverless

This is another modern approach to development. Because of the name, many people mistake that this is really serverless development, and you do not need to write back-end code, so any front-end developer will be able to make a web application. However, this is not the case!

When creating a Serverless application, the server is still needed, and so are the databases. The main difference with this approach is that the back-end code is presented in the form of a cloud function (another name for serverless is FaaS, Functions as a Service or Functions-as-a-Service) and allows the application to quickly and easily scale. The developer can focus on business tasks and not think about scaling and configuring the infrastructure. This approach reduces time and development costs. Moreover, Serverless approach will help to save on server rental, since it uses exactly as many resources as needed to complete the task.Also, if there is no load, then server time is not used at all and is not paid.

For example, the large American media company Bustle, was able to reduce hosting costs by more than 60% when switching to Serverless. And Coca-cola, while developing an automated system for selling drinks through vending machines, was able to reduce hosting costs from $ 13,000 to $ 4,500 a year by switching to Serverless.

Today, thanks to the evolution of software, the versatility and power of server containerization, tools are emerging that allow you to remove restrictions, simplify, and in turn, speed up the development of cloud applications.

This means that corporate business scenarios in which cloud upgrading was previously considered impossible (for example: peripheral devices, transmitted data, or stateful applications) are now a reality. Good promising tools are kNative and Serverless enterprise.

But with all this, Serverless is not a silver bullet for developing web applications.

To help you figure it out, here are a few examples when you should think about Serverless in developing a new or improved web service:

  • When the load on the server is periodic and you pay for idle capacity. In this case, it is much more efficient to pay only for the actual use of resources.
  • If you do not plan to dive into the technical details of the infrastructure and overpay for setting up and maintaining servers. For example, when developing a marketplace, you don’t know exactly what the traffic will be or if you need to plan on a large amount of traffic. For your application to withstand the load, Serverless is a great choice.
  • If you need to perform some streaming events in the main application. For example, to collect analytical data on user actions, process them in a certain way, and save them to the database.
  • If you need to speed up the current application. For example, to create performance-improving services for working with images or videos when a user uploads video to the cloud, and a separate function is involved in transcoding, while the main server continues to work as usual.
  • If you need to process events from third-party services. For example, process responses from payment systems, or redirect user data to CRM to speed up the processing of requests from potential customers
  • If you have a large application and some parts of the application can be implemented more optimally, using a language different from the main one. For example, you have a Java project and you need to add new functionality and there is already a solution in another language, then Serverless can help.

These are not all of the tools and technologies that deserve attention. Listed above are examples which are already actively used every day at work and can help your business.