Single Page Application  

Before the improvement of browsers and the advent of single-page web application technology, all web pages when it is  requested the server creates an HTML file and sends it to the user, then the browser reads and displays it to the user. This process is repeated with every action that the user performs, which creates a burden on the server, in addition to the time spent sending requests and waiting for a response over the Internet. Especially if it's large HTML, CSS, or Javascript files. In this blog, we will talk about answering the following questions:

  • What is the concept of Single Page Web Applications (SPA) ? 
  • What are its advantages  ? 
  • What are the most  challenges that the developer will face ? 

Introduction to Single Page Web Applications :

SPA technology relies on sending all application files only once (HTML, CSS, javascript). Their size may be large the first time when entering the site, but browsers work to cache them temporarily and reuse them for the next time. After that, instead of requesting the page from the server, the application only requests data (in the form of JSON) as it uses Asynchronous Javascript and Xml (AJAX) technology to send and receive requests without the need to reload the page. After that, the browser generates (rendering) HTML files and displays them to the user.
 

figure1

 

Advantages of SPA Technology :

  • Improving the user experience: Single-page applications allow a more easy browsing experience for the user, as it eliminates the time spent on moving between website pages and the need to reload the page in addition to greatly increasing the loading time. 
  • Cache and Offline Support: SPA technology enables the use of the cache in the browser to effectively store all data sent from the server and then use it to work offline during times of poor connection. The data is synchronized when the connection to the server is restored. Like the home page in the Facebook application
  • Reducing pressure and tasks on the server, as the server becomes charged only to send the required data and does not guarantee the way it is presented to the user. In addition to the ability to perform many tasks in the browser from the user side without referring to the server, such as processing images and editing texts interactively 

 

 SPA Technology Challenges and Disadvantages : 

  • One of the biggest challenges that SPA users face is poor compatibility with the search engine SEO because this technology is of a dynamic nature that relies on loading one page and then displaying data on it without reloading the page and the absence of a separate URL optimized for search engines, so search engines do not see the content, but Many developers are still trying to find a solution to this challenge, which led to the improvement of search engine programs and the emergence of the term Server side-rendering, which we will talk about in the next articles
  • SPA technology relies heavily on JavaScript, which leads to poor performance in devices with low capabilities, and some problems related to RAM consumption may appear when staying for a long time, and the application will not work if JavaScript is disabled in the browser.

 

Conclusion :

With the advent of SPA technology, JavaScript frameworks appeared with it, making it easier for the developer to create an application based on SPA technology and overcome many of its challenges from these frameworks, VueJs. In addition, there are many communities that include highly experienced developers who find suitable ways out of these challenges. In the next blog we will talk about how to combine VueJs with a SPA.
 

Add new comment

This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.