Support » Plugin: Translate WordPress with GTranslate » Ouch! Slows Down Website

  • Resolved jetxpert

    (@jetxpert)


    Hi there,

    We love your plugin and have corresponded with you before. Support has been awesome!

    Recently, though, we learned your plugin (or Google) is slowing down our website loading speed quite a bit.

    We performed a website speed analysis using webpagetest.org and found that nearly 24% of website-loaded resources are due to “translate.googleapis.com/*” Ouch!

    Click below for details.

    Webpagetest Results

    Loaded Google Translate Resources

    Is their anything we can do to reduce the number of google translate resources? For example, are there any simple techniques or header codes we can use to preload, prefetch, or simply minify these google translate resources?

    Also, if the pro version of your plugin will solve this, before we sign up, kindly run a test and provide results (resources loaded and speed test comparisons).

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author edo888

    (@edo888)

    Hi,

    You are using free version which loads resources (JS, CSS) to add functionality of translation on your website.

    From the results in the reports I can see that the resources are being loaded asynchronously and it takes it no more than 35ms to load them, so I’m not sure why you call it “excessive” in the tags section for this topic.

    In our paid version this resources are not required to be loaded, so it doesn’t add any overhead on your original website. It will only add some overhead if you add the language switcher and it only depends what kind of language switcher you add (flags, no flags, etc.).

    I cannot run a test, because it needs to be activated first.

    Thanks! 🙂

    jetxpert

    (@jetxpert)

    Hi @edo888,

    Just saw this. Thank you for the quick reply. We truly enjoy using your plugin.

    After additional testing, we can confirm that your plugin adds 10 additional HTTP requests and .2-.4 seconds to our total website loading time. Not a biggie, but important to share with the community.

    Considering that your plugin is free, we can live with the performance penalties at this time. Trimming some “fat” from your plugin at next convenient plugin update would be a nice gift to all.

    Again, thank you!

    Good News!

    After thorough research, we were able to eliminate six (6) external HTTP requests generated by this plugin and significantly improve our website loading time by adding the following code to the </head> of our website:

    <link rel="preload" href="//translate.googleapis.com/translate_static/js/element/main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/element/TE_20200210_00/e/js/element/element_main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/translate_static/css/translateelement.css" as="style">
    
    <div id="google_translate_element"></div>
    
    <script>
        function googleTranslateElementInit() {
            new google.translate.TranslateElement(
                {pageLanguage: 'en'},
                'google_translate_element'
            );
        }
    </script>
    
    <script src="//translate.google.com/translate_a/element.js?cb=TranslateInit"></script>

    Note: Adding the above code to our website did not impair the functionality of this plugin.

    Above confirmed using the following tools:

    https://webpagetest.org
    https://gtmetrix.com
    https://developers.google.com/speed/pagespeed/insights/

    Hope this helps the community. Stay safe!

    Good News (again)!

    If the above code does not work for your website, or your website’s base language is not English, use the following code:

    <link rel="preload" href="//translate.googleapis.com/translate_static/js/element/main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/element/TE_20200210_00/e/js/element/element_main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/translate_static/css/translateelement.css" as="style">
    
    <script src="//translate.google.com/translate_a/element.js?cb=TranslateInit"></script>

    Please stay safe!

    Good News (yep, again)!

    Above codes may not work with all browsers. If so, accomplish the following:

    (1) Install the following code in the </head> section of your website:

    <script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"> 
    </script>  
    
    <link rel="preload" href="//translate.googleapis.com/translate_static/js/element/main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/element/TE_20200210_00/e/js/element/element_main.js" as="script">
    
    <link rel="preload" href="//translate.googleapis.com/translate_static/css/translateelement.css" as="style">

    (2) Clear your browser(s) cache and history (both global and local)

    (3) Restart your browser(s)

    Cheers. Stay safe!

    @jetxpert
    Thank you !! This code hast increase speed nearly by 0,8 second!

Viewing 6 replies - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.