The focus of this article is on the technical performance of websites, which in this context means the site's speed and how much traffic it can handle. Technical performance is different from marketing performance, which can be measured using variables such as unique visitor traffic, returning visitors, bounce rate, and conversion rate.
The technical performance of a website has a profound effect on the user experience of the website visitors. However, the desired performance depends heavily on what kind of a website you have. An acceptable page load time for a retail web store can be much too slow when playing an online game.
Several factors affect the technical performance, such as the web server hosting the site, available bandwidth, web page design and structure, and, last but not least, factors you can't affect: visitor's location, device, and browser type.
The page loading process, illustrated in a very simplified form in the following figure, begins when the visitor makes a request (for example, clicks a link or enters an URL in the browser address bar). The browser conveys the HTTP request to the web server, which processes the request and sends a response to the browser. The browser then parses, loads, and renders the page content, making it visible to the visitor. The visitor obviously only sees what happens (or doesn't happen) in the browser after the browser starts rendering the page content.
Figure: Page loading process
When the rendering starts, the browser first builds the page DOM (Document Object Model), which represents the HTML structure of the page, and starts downloading items defined in the page
When the page content starts to appear, HTML text elements are typically displayed first. This is often called "useful content display". Ideally, the visitor first sees the page header and navigation, immediately followed by content. By showing the visitor as much content to interact with as quickly as possible you improve the perceived performance of the site and, therefore, the chances that the visitor will stay on the page.
Graphics normally only appear after text and shouldn't therefore hold critical information.
You can use several metrics to measure the speed of a site, such as:
Websites and applications that are quick to load have significantly better engagement and conversation rates. What, then, is a good response time? According to Jakob Nielsen, there are three important limits:
John Stevens from WebdesignerDepot.com states that in 2016 the desirable page load time was 0.5-2 seconds. Currently, the average load time is closer to 5 seconds, but according to Stevens, this just shows that most websites are not yet fully optimized for site speed.
You can improve page load time in several ways, including:
When monitoring and measuring site performance, note that it is greatly affected by the visitor's location, network connection, device, and browser.
It's important to remember that the actual performance of the site may differ from the perceived performance. Perceived performance refers to how fast a visitor thinks your website is regardless of how fast it technically performs. While you should have an optimization strategy in place, you can also use different techniques to make your website feel faster and make its user experience more pleasant:
Strategically place animated spinners, progress bars, or other progress indicators on the page.
A progress indicator informs the visitor that even though there isn't much to see yet, something is happening and they can expect the content to show up soon. However, you should use especially spinners with caution as they may also make your visitors pay attention to the delay and thus impair the perceived performance.
Use lazy loading.
Lazy loading means delaying the loading of objects until the visitor needs them. For example, you only start loading an image on a page when the visitor scrolls down and the image becomes visible in their viewport. The page therefore loads faster and, in some cases, the server load is reduced.
There are several other methods you can use to increase both the actual and perceived performance of your site.
The Frosmo Platform uploads the custom script and associated media files (ones added directly to modifications) to the CDN every time they need to be updated, that is, every time something on your site is changed using the Control Panel. The assets are always exported to CloudFront and, when needed, copied from CloudFront to other CDNs.
The Frosmo scripts are optimized for performance, making the loading times generally faster than that of advertising scripts. The Frosmo Core library is very compact, less than 50 KB. The size of the custom script usually varies between 16 KB and 32 KB. To prevent the custom script from growing too large, make sure that you don't maintain unnecessary segments, placements, or modifications whose content is preloaded for your site. For more information about managing and removing items using the Frosmo Control Panel, see Managing segments, Managing placements, and Working with modifications.
Working mainly with content procured by our customers means that Frosmo content modifications should not increase any overhead. Naturally, this depends on the type of content being used; high-definition images and videos are slower to load. When Frosmo is used to filter away (hide) existing content, Frosmo's optimized version of a website can be even faster than the original site.