Reduce the impact of third-party code on aem

Avatar

iwanttobeDev

02-07-2020

Hello i want to ask best practice to reduce third party execution time, on aem

except: async and defer

for example the script is 'rechapta'

 

anyone have solution? Thanks in advance

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Vaibhavi

MVP

02-07-2020

Hi @iwanttobeDev 

AEM doesnot have control over third party script. If we are injecting third party script make sure we follow best practices such as minification of script, removing the blocking resources, defer loading, optimisation etc. 

 

Lighthouse plugin in chrome developer tool is one of the good plugin which reports about improvements and solution to increase the performance of site. 

 

You can follow the best practices document along plugin as well. 

 

Answers (2)

Answers (2)

Avatar

vanegi

Employee

02-07-2020

You can have a look at https://helpx.adobe.com/in/experience-manager/kb/optimize-aem-site-performance.html for best practices to improve the performance of your site overall.

 

  • Use and optimize AEM client libraries - client libraries are an easy way to centralize the management and optimization of CSS and JavaScript code in your site.
    • Embed client libraries to consolidate them into fewer files.
    • Minify the libraries.
  • Put CSS includes in HTML <head> tag – this helps avoid flickering and repainting of the page after load.
  • Put JavaScript <script> includes in end of <body> tag or add the async script attribute - this allows the browser to load JavaScript files in parallel while the page is being rendered.
  • Implement Domain Sharding - By default, web browsers limit the maximum number of parallel requests per domain during page load.  This can cause delays in loading the page if you have many resources such as CSS, JavaScript, etc that need to load before your page is rendered.  Domain sharding is a solution that helps work around this problem.  Domain sharding is where you include files such as CSS and JavaScript on your site via multiple subdomains. 
    •  For example:
      <script src="//includes1.yoursite.com/etc/clientlibs/test.js"></script>
      <script src="//includes2.yoursite.com/etc/clientlibs/test2.js"></script>
    • Use ACS Commons - Static Reference Rewriter to implement domain sharding.
  • Cache JavaScript and CSS for long periods of time - To allow caching javascript and css for long periods of time, leverage ACS Commons - Versioned Clientlibs.
  • See the Google PageSpeed rules documentation for more pointers on how to optimize your site.
  • See this AEM Gems session for further information on site optimizations.