Italiano Italiano

Google translate

How to speed up Google translate button

That is how to speed up the Google translator on the site

To translate your pages into many languages it is very useful to use the Google translate button that is the page translation button provided by Google:

Google translate button

But like many scripts it introduces a delay time that slows down the loading of the page, in this specific case, the typical delay measured for the button to appear is approximately 1.2 seconds.
This penalizes the page load time as you can measure from the Google tool: PageSpeed Insights, which gives you a high "Time to Interactive", here I explain how to reduce the loading time of the google translator and in general any script that is useful but not used by all users of your site.

Normally you should add scripts to your page:

<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'it'}, 'google_translate_element');
}
</script>

<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>


and put the following code where you want the key to appear:

<div id="google_translate_element"></div>

If you use the following PHP trick you can have the functionality of the Google translate button without increasing the loading time "normally",,
add it where you want the button to appear:

<?php
if ($_GET['Transl'] == "1")
{
echo '<div style="text-align: center;" id="google_translate_element"></div>';
echo '<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>';
echo '<script type="text/javascript">';
echo 'function googleTranslateElementInit() {';
echo ' new google.translate.TranslateElement({pageLanguage: \'it\'}, \'google_translate_element\');}';
echo '</script>';
} else
{
echo '<a rel="noopener noreferrer nofollow" href="tua_pagina.php?Transl=1" title="Google translate">';
echo '<img src="tua_immagine.png" alt="Google translate" title="Google translate"></a>';
}
?>


Where your_page.php is your page to translate and your_image.png is the starting image, which acts as a placeholder, for example an image similar to the button itself, which you can eventually replace with plain text, for example Translate , removing the image from the link.

How it works:
- when you open your page, the image or text placed as a simple link appears, so the script is not interpreted and loading is fast
- in the rare case in which the user wants the translation, he clicks the link and the same page is called up with the parameter ?Transl=1
- the page is reopened but this time theif control ($ _GET ['Transl'] == "1") opens it with the translation key itself, in this rare case the user he is willing to wait that extra second because it has required a specific function that is indispensable to him.
- At this point the user chooses the language in which to translate and Google translate does the rest.

Redo the measurement with the PageSpeed Insights, and you will see a much lower normal "Time to Interactive" and not only that.

This is the measure with the inserted script:
Translate con lo script 1 Translate con lo script 2

This other is the measure without always inserted script:
Translate senza script 1 Translate senza script 2

I suggest adding the Google translate button at the top, center or right, where normally the user who doesn't know your language but is interested in your page expects and hopes to find the link to the translation in their language.
This trick to insert google translator is used on this page you are reading, see the button in the middle of the first line at the top next to the menu; you can measure the loading time with and without the ?Transl=1 parameter, ie with and without the translation key scripts and see the difference; you can also simply refresh the page and see the difference in loading in both cases.

Remember that the page loading time is strongly influenced by the hosting you use, the free ones are generally quite slow, I suggest one of these services, which at the cost of a few coffees a month offer you an excellent quality / price ratio and a remarkable speed:

siteground European

VHosting Italian

Take a look at our products, services and opportunities



Website under construction, we are working for you ...

Shop
Shop
Forum
Forum
Blog
Blog
GitHub
GitHub
Facebook
Facebook
Messenger
Messenger
@Turcotronics
Twitter
Linkedin
Linkedin
Instagram
Instagram
YouTube
YouTube
Feed
Feed
Contacts
Contacts
Pinterest
Pinterest
Download
Download
Share
Share
Ausilio
Ausilio

Turcotronics®   P. IVA TODO to add

Contacts - Print

https://www.turcotronics.it/

  Privacy/Cookie/GDPR - Terms/Conditions

Except where otherwise specified, the content of this site is released below
Creative Commons: Attribution - No derivative works 4.0 International