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

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

You might have caught a summary of our findings on our streamed show "Speed Matters". Here, we delve into the study in detail.

From a speed perspective, widgets from LimeTalk, Daktela, or LiveAgent performed best. However, choosing the most popular SmartSupp won't lead to a performance faux pas either.

On the flip side, be cautious with Manychat, Zopim, and even the well-known Facebook Chat Plugin (also known as Messenger). The impact on speed varies significantly among chats. Incidentally, one of them can lower your Lighthouse speed score by a whopping 35 points out of 100.

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

According to this year's Reshoper study, about one-fifth of Czech e-shops use some chat widget. Thus, live chats significantly affect the online shopping experience for many Czechs.

Thanks to Filip Podstavec from Marketing Miner, we obtained updated data in November 2020 on the most used web chats in the Czech Republic. Smartsupp clearly dominates, but the full 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 was as follows:

• Each live chat was inserted according to the manufacturer's basic instructions into a completely blank page, and also into a more complex page — for this purpose, we chose the Landkit template.
• Each resulting test page was measured over several days using synthetic tests from the SpeedCurve tool simulating a slow mobile device, the Samsung Galaxy S4. The resulting dashboard. Results table.
• The most popular services were further subjected to manual tests in the browser by my colleague Michal Matuška. He focused on validating synthetic test outputs and sought improvements for both website owners and widget authors.

What Did We Measure?#

To compare the results obtained, of course, we didn't hesitate to use several available web speed metrics.

Let's start with technical indicators. They play a less significant 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 today.

However — as a website operator, you probably wouldn't want your users to download an entire megabyte of extra data just for a chat service. Think this can't happen? Please bear with us for a moment longer.

Moreover, if the live chat data is transferred at an inopportune time, it can slow down the browser's downloading of much more important elements of your website.

How did it pan out?

• Limetalk excelled here, with only 8 kilobytes transferred (!).
• Conversely, thanks to Facebook's developers, over one megabyte of data is downloaded into your site with Messenger. For Manychat, the figure 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 matter much, as long as 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 bandwidth with your site's files.

• Excellent results were achieved by LimeTalk and Daktela (both 5 files) or LiveAgent (7 files).
• Facebook downloads 42, Manychat even 49 files. From such a number, one could assemble a decently sized website.

However, it's worth noting that rendering strategies chosen by chat authors play a role here. Some services download a large amount of data upfront, but their chat "bubble" becomes available quite quickly. For others, which are more data-efficient, the initial display takes some time.

Let's move on to another indicator. This one is crucial, as we consider it a vital speed impact indicator.

Lighthouse Performance Score (LPS)#

We couldn't skip the "Lighthouse score". Comprising six essential metrics, it gives a comprehensive picture of the website's potential speed. More about LPS can be found on Vzhůru dolů.

What's the chat impact on LPS on a blank page?

• LimeTalk, Daktela, and LiveAgent stand out — the Lighthouse score (measured via SpeedCurve) remains at 100 points. Also commendable are Livechatoo (99 out of 100) and SmartSupp (95 out of 100).
• The tail end of the pack is quite dismal for this metric. Zopim reduces a blank page's Lighthouse score from 100 to 67 points, Manychat even to 65 out of 100. That's really bad.

Here, we might conclude that we know the winners and losers. But it's not that simple. We'd like to point out a few more crucial factors.

Let's start with a metric that's part of the Lighthouse Performance Score, but we perceive it as one of the most crucial in the context of third-party components.

Total Blocking Time (TBT)#

"Total Blocking Time" indicates the interval the browser needs to process complex JavaScript tasks, during which the user can't interact with the already rendered page. More on TBT.

Let's see the winners and losers of this indicator:

• For LimeTalk and LiveAgent, SpeedCurve measured zero blocking time in all tests, which is fantastic. Livechatoo (10 ms), FoxyDesk (28 ms), Daktela (46 ms) also boast excellent results, and even the popular Smartsupp's results aren't bad (270 ms).
• From our perspective, Zopim (1,079 ms) is beyond acceptable limits, and Manychat (438 ms) hovers on the edge.

For context — we measured on a mobile emulation, where, for instance, a standard Google Analytics setting consumes around 100 ms of TBT.

In an ideal world, components would not have any page-blocking intervals longer than 50 ms, which TBT measures, during JavaScript processing. But as developers, we know that's a hard-to-reach goal.

Apart from the aforementioned Zopim, we could conclude that 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 his detailed browser examination of the most popular widgets, also focused on display speed. It turned out as follows:

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

Tawk displays the fastest, but it's true that its authors chose a strategy of quickly displaying the initial "bubble", so the initialization of Tawk's communication window takes a bit longer.

We'd bet that most website operators prefer to display their essential content first, rendering communication tools to users in a second or third wave.

This strategy may not suit everyone, but if adhered to, the later display of SmartSupp or Facebook might not be bothersome. Conversely, it might be wise to reduce the priority of the fast-downloading and rendering Tawk or otherwise slow it down.

And now we reach the finale, as you're surely interested in the final verdict.

Overall Evaluation#

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

	LPS	Downloaded 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

Test results table: LPS represents Lighthouse Performance Score, followed by the number of downloaded kilobytes, files, and Total Blocking Time in ms. For metric explanations and a deeper analysis, refer to the text above.

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

The more green numbers a chat widget received, the better. Conversely, be wary of communication tools with more than one red number.

Let's summarize the results into a few recommendations based solely on speed tests:

• We highly recommend choosing any chat from the trio LimeTalk, Daktela, or LiveAgent. The first one, in particular, achieves remarkable ratings. From a loading performance perspective, you won't go wrong with SmartSupp, Tawk, or Livechatoo either. They didn't excel, but their results aren't bad at all.
• On the contrary, Manychat didn't fare well in our study, followed by Zopim and Facebook.

We'd like to emphasize once more that we didn't consider other parameters than speed here, but we expect you'll do so when selecting 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 Chrome's developer tools.

We conducted measurements via Lighthouse in Chrome (Version 86.0.4240.183 (Official Build) (x86_64)) and in an incognito window, in mobile view.

SmartSupp#

The chat appears around the fifth second. The download waterfall for the necessary files could be improved, which would speed up the chat's appearance. The chaining seems unnecessary. Every removed link here means a significant leap.

Chaining of files when downloading SmartSupp.

The JavaScript runtime itself is around 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 definitely the previously mentioned data size. There are many large files being transferred, JavaScript that needs to be downloaded and executed. This pushes back the display. The transferred data also slows down the transfer of other resources the web depends on.

Given the data volume, when implementing Facebook Chat, the lazy loading method mentioned later in the text would be most helpful.

Tawk#

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

The download waterfall of Tawk widget files truly looks like a waterfall. Source: Chrome DevTools.

We don't have much to add here. We were only surprised by the three references to a font from Google. Moreover, they seem to link to the same file:

Multiple requests for the same files slightly tarnish the otherwise excellent impression of Tawk. But that's a minor issue that HTTP caching will not affect in regular operation.

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

A Few Notes on SmartSupp and LiveAgent#

We were pleased with the excellent results of two local products — Czech SmartSupp and Slovak LiveAgent.

Smartsupp wasn't a champion in web speed matters until recently, but with the transition to a new widget version, many client numbers have significantly improved.

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're using one of the slower chats, don't hesitate to reach out to the authors. But that's leading to general recommendations, which we've saved for the end.

Another Czech software — FoxyDesk — also achieved decent results, but we'd prefer the widget to download fewer files and data.

General Recommendations for Developers, Marketers, and Website Owners#

To wrap things up, here are general recommendations, regardless of the live chat tool you use.

Choose Live Chat Based on Speed#

Include speed in your criteria for selecting a live chat. As our study shows, many of them will significantly affect your website's speed.

Measure the Impact of Third-Party Components#

Measure the impact of third-party components. We use third-party analysis in SpeedCurve, but a third-party analysis from ordinary Lighthouse can also help you a lot. More about third-party component analysis can be found on Vzhůru dolů.

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

Communicate with Widget Authors#

Do you see an unpleasant impact of the widget on the initial page render speed? First, write to the authors; it might just be that they haven't started addressing it yet.

Consider Lazy Loading the Widget#

Consider the method of lazy loading the chat.

Optimized widget at Smarty.cz. Source: Vzhůru dolů.

The lazy loading method involves replacing the live chat with a placeholder, usually an image.

The actual chat widget then loads later. The first option is user-triggered activation, such as clicking on the placeholder or hovering the cursor. The second option is downloading after a certain time so that the widget files don't 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 reach out to PageSpeed.ONE.