Comparison of SPA with MPA

[hasinam2206]

5) To provide the user with the information they need in one place, to increase the speed of loading and updating data, the “Cart” and “Order” sections were implemented as a SPA – Single Page Application (single-page application) on Vue.js. Such applications can dynamically load the necessary content from the server without updating the interface. They work quickly and put less load on the server, and the user gets the feeling that he is doing all the actions on one page.
In solving a number of problems, SPA architecture has more advantages:

SPA works well where there are many dynamic belarus mobile database forms and actions can be performed without switching pages;

the buyer cares about the speed of the site, and SPA works faster because it only needs to update certain modules, not the entire page. The server returns lightweight JSON instead of heavy HTML. Some content is cached, so the update can happen almost instantly;

a site on this architecture saves data and its original state as long as the tab is open in the browser, which is convenient when working with a catalog, shopping cart, and order at the same time;

Since SPA allows for a complete separation of the frontend and backend, then, when subsequently creating a mobile application or globally transferring a site, major changes to the backend will no longer be required. This greatly saves the customer's budget.

The figure illustrates the difference in working with the page in the browser.


Large retailers (Ozon, MVideo), delivery (Delivery-club, Utkonos), and postal services work on SPA and have appreciated the speed and scalability of the solution.

We will tell you more about the implementation nuances.

The business task looked simple and clear - to help the user choose a pharmacy, in a convenient form showing where the order can be issued in full, and where partially. Previously, the location of the product was visible only inside its card in the pick-up section, you had to switch to it and scroll through the entire list of pharmacies.

image9.png

Now you can find out about the availability of a product directly from the catalog, without going to the detailed card. Just by filtering or viewing the list of pharmacies in the pop-up panel.

View pharmacies with the ordered item.jpg

But the detailed product card has also been updated, adding a geomap with information blocks.