PageSpeed.ONE Study: The Impact of Chat Widgets on Website Speed

Live chat is used by twenty percent of Czech e-commerce operators. But how do these components affect website speed? We took a closer look at the ten most popular live chats and uncovered some intriguing insights.

A summary of our findings was presented in our streamed show "Speed Matters". The detailed study is presented in the text below.

From a speed perspective, widgets from LimeTalk, Daktela, or LiveAgent performed excellently. However, choosing the most popular SmartSupp isn’t a mistake either in terms of loading performance.

Conversely, be wary of Manychat, Zopim, and even the well-known Facebook Chat Plugin (also known as Messenger). The differences in speed impact among chats are indeed significant. Incidentally, one of them can decrease your Lighthouse speed score by as much as 35 points out of 100.

What Are the Most Popular Live Chat Services in the Czech Republic?#

According to this year's Reshoper study, roughly one-fifth of Czech e-shops use some chat widget. Thus, live chats have a notable impact on the user experience of a significant portion of Czechs shopping online.

Thanks to Filip Podstavec from Marketing Miner, we obtained updated data on the most used web chats in the Czech Republic in November 2020. Smartsupp clearly dominates among them, but the entire top ten ranking is as follows:

1. SmartSupp
2. Facebook Chat Plugin
3. Tawk
4. Zendesk/Zopim
5. FoxyDesk
6. Livechatoo
7. LimeTalk
8. Daktela
9. LiveAgent
10. Manychat

How Did We Measure?#

Our methodology looked like this:

• Each live chat was embedded according to the manufacturer's basic instructions into a completely blank page and also into a more complex page – for this we chose the Landkit template.
• Each resulting test page was measured over several days using synthetic tests from SpeedCurve emulating a slow mobile device, the Samsung Galaxy S4. The resulting dashboard. Results table.
• The most popular services were also manually tested by our colleague Michal Matuška in the browser. He focused on validating the outputs of synthetic tests and sought improvement opportunities for both website owners and widget authors.

What Did We Measure?#

To compare the obtained results, of course, we did not hesitate to use several available web speed metrics.

Let’s start with technical indicators. They play a somewhat lesser role in the overall picture, but you’ll soon see why we paid attention to them.

Transferred Data#

The data volume that widgets download might seem like a less significant metric from today's perspective.

However – you probably wouldn't want your website users to download an entire megabyte of data just for a chat service. Think this couldn’t happen? Then please bear with us a moment longer.

Moreover, if live chat data is transferred at an inopportune time, it could slow down the browser’s downloading of far more important elements of your site.

How did it turn out?

• Limetalk excelled here, with only 8 kilobytes transferred (!).
• On the other hand, thanks to the developers at Facebook, over one megabyte of data is downloaded to your site with Messenger. Manychat even stopped at 1.1 MB.

Number of Downloaded Files#

In the era of modern HTTP/2 and HTTP/3 protocols, the number of files doesn’t play a massive role, provided the files are small in data size.

But again – it’s courteous for any service to keep the number of downloaded files in check, as they have to share resources with your site’s files.

• LimeTalk and Daktela show excellent results here (both 5 files) along with LiveAgent (7 files).
• Facebook downloads 42, Manychat as many as 49 files. From such a quantity, one could compile quite a large website.

It's worth noting that the rendering strategy chosen by the chat authors plays a role here. Some services download a large amount of data upfront, but their chat "bubble" is available quite soon. For others, which are more data-conscious, the initial display takes some time.

Let’s move on to another indicator. Here, things get a bit serious, as we consider it an essential indicator of speed impact.

Lighthouse Performance Score (LPS)#

We couldn't leave out the "Lighthouse score". Consisting of six essential metrics, it gives a comprehensive picture of the potential overall speed of a website. More about LPS.

What impact do chats have on the LPS metric on an empty page?

• LimeTalk, Daktela, and LiveAgent shine – the Lighthouse score (measured via SpeedCurve) remains at 100 points. Let’s also applaud the excellent results of Livechatoo (99 points out of 100) and SmartSupp (95 points).
• The view at the tail end is quite gloomy with this metric. Zopim lowers the Lighthouse score of an empty page from 100 to 67 points, Manychat even to 65 out of 100. That’s rather poor.

Here, we might think we know the winners and losers. But it’s not that simple. We’d like to draw your attention to other important factors.

Let’s start with a metric that, while part of the Lighthouse Performance Score, we regard as one of the most crucial when it comes to third-party components.

Total Blocking Time (TBT)#

"Total Blocking Time" indicates the interval required by the browser to process complex JavaScript tasks, during which the user cannot interact with the already rendered page. More about TBT.

Let’s look at the winners and losers for this indicator:

• LimeTalk and LiveAgent recorded zero blocking time in all SpeedCurve tests, which is excellent. Great results were also achieved by Livechatoo (10 ms), FoxyDesk (28 ms), Daktela (46 ms), and the results of popular Smartsupp aren't bad either (270 ms).
• Zopim is beyond acceptable values from our perspective (1,079 ms) and Manychat hovers on the edge (438 ms).

For context – we measured with a mobile emulation where, for instance, standard Google Analytics consume around 100 ms of TBT.

In an ideal world, it would be best if components didn’t have any blocking intervals longer than 50 ms, as measured by TBT, when processing JavaScript. But as developers, we know that's a challenging goal.

Besides the aforementioned Zopim, we could say that the measured live chats have a less negative impact on user interactivity than expected.

Chat Display Speed#

As you might have seen in the video, Michal Matuška, during an in-depth browser dissection of the most popular widgets, also focused on display speed. It turned out like this:

Chat	Display Speed
SmartSupp	5 s
Facebook	7 s
Tawk	2.7 s

Tawk displays the fastest, although it is fair to say that its authors opted for a strategy of quickly displaying the initial “bubble”, so the initialization of the communication window with Tawk takes a little longer.

We’d wager that most website operators are primarily interested in displaying their main content first, rendering communication tools for users in the second or third wave.

This strategy may not be universal, but if adhered to, the later display of SmartSupp or Facebook might not be an issue. Conversely, it might be appropriate to lower the priority or otherwise delay the quickly loading and displaying Tawk.

Now we reach the finale, as you are surely interested in the final verdict.

Overall Evaluation#

First, let's transfer all the results into a table.

	LPS	Transferred kB	Files	TBT in ms
SmartSupp	95	247	12	270
Facebook	78	1,052	42	319
Tawk	93	177	16	135
Zopim	67	554	15	1,079
FoxyDesk	87	517	30	28
Livechatoo	99	49	16	10
LimeTalk	100	8	5	0
Daktela	100	36	5	46
LiveAgent	100	27	7	0
Manychat	65	1,127	49	438

The test results table: LPS represents the Lighthouse Performance Score, followed by the number of transferred kilobytes, the number of files, and Total Blocking Time in ms. Explanation of metrics and deeper analysis can be found in the text above.

For each evaluated criterion, we identified two to three best and worst live chats (marked in red).

The more green numbers a chat widget received, the better. Conversely, communication tools with more than one red mark should be approached with caution.

Let us summarize the results into a few recommendations based purely on speed tests:

• We warmly recommend choosing any chat from the trio of LimeTalk, Daktela, or LiveAgent. The first one mentioned, in particular, achieves truly excellent ratings. However, opting for SmartSupp, Tawk, or Livechatoo isn't a mistake performance-wise. They may not have excelled, but their results are not bad at all.
• In our study, Manychat did not fare well, followed by Zopim and Facebook.

We emphasize again that we did not consider factors other than speed, but we assume you will when choosing a suitable component.

Autopsy of the Top Three in the Browser#

In addition to Martin’s measurements from SpeedCurve, Michal conducted a detailed analysis of the downloading and rendering of the three most popular chat tools directly using the developer tools in Chrome.

The measurements were performed via Lighthouse in Chrome (Version 86.0.4240.183 (Official Build) (x86_64)) and in incognito mode, using a mobile view.

SmartSupp#

The chat appears around the fifth second. The download waterfall of individual files necessary for launch could be improved, allowing the chat to display faster. The chaining is considered unnecessary. Each removed link here signifies a significant leap forward.

File chaining during SmartSupp download.

The JavaScript runtime itself takes about 380 ms in the browser, which we consider a good result.

Facebook Chat Plugin#

The chat appears around the sixth second. A suggestion for improvement to Facebook is certainly the previously mentioned data size. There’s a lot of data transferred in large files, JavaScript that needs downloading and execution. This postpones the display. Transferred data also slow down the transfer of other resources the website depends on.

Given the data volume, the greatest benefit when implementing Facebook Chat would be the lazy loading method, which we mention later in the text.

Tawk#

The chat appears around the third second. The download waterfall looks nearly exemplary:

Tawk widget file download waterfall truly looks like a waterfall. Source: Chrome DevTools.

Here, we have little to add. We were only surprised by three references to a Google font. Moreover, it seems to be a link to the same file:

Multiple queries for the same files slightly mar the otherwise excellent impression of Tawk. But this is a minor issue that does not manifest in regular operation thanks to HTTP caching.

The runtime itself processes around 300 ms, which is again very good.

A Few Notes on SmartSupp and LiveAgent#

We were pleased with the very good results of two local products – Czech SmartSupp and Slovak LiveAgent.

Smartsupp wasn’t considered a champion in web speed matters until recently, but with the transition to a new widget version, we have seen significant improvement in numbers for many clients.

Deployment of the new SmartSupp widget version at one of our clients, a medium-sized e-shop.

We were in contact with both companies and must say they certainly don’t take speed lightly.

We’d like to motivate you too. If for some reason you are using one of the slower chats, don’t hesitate to reach out to the authors. But that leads us to general recommendations we’ve saved for the end.

Another Czech software – FoxyDesk – also achieved decent results, but we’d prefer if the widget downloaded fewer files and data.

General Recommendations for Developers, Marketers, and Website Owners#

Finally, we offer general recommendations, regardless of which live chat tool you use.

Choose Live Chat Based on Speed#

Add speed to the parameters for choosing a live chat. As seen from our study, many of them significantly affect your website speed.

Measure the Impact of Third-Party Components#

Measure the impact of third-party components. We use third-party analysis in SpeedCurve, but even an analysis of third parties from a standard Lighthouse can greatly help. More about third-party component analysis and optimizing third-party JS on web.dev.

In monitoring PLUS, we offer the option to measure the overall impact of third-party components using the 3PBT metric.

Communicate with Widget Authors#

See an unpleasant impact of a widget on the initial page rendering speed? First, write to the authors; it’s possible they simply haven’t addressed it yet.

Consider Lazy Loading the Widget#

Try the method of delayed loading of the chat.

Optimized widget on Smarty.cz.

The method of delayed loading (lazy loading) involves replacing the live chat with a placeholder, most commonly an image.

The actual chat widget is then loaded later. The first option is to trigger it on user action, such as a click on the placeholder or cursor hover. The second option is downloading after a certain period, so the widget files do not slow down the downloading and execution of more important page elements.

If you need help optimizing your live chat or website speed, don't hesitate to contact PageSpeed.ONE.