Expand my Community achievements bar.

SOLVED

Handling the page performance issues

Avatar

Level 8

Hello All,

 

There might be different reason for the page performance issue. As an architect, what are the steps we need to follow to increase the page performance ?

 

1: Check the network tab to see the list of image file size. If its too huge, ask Author to correct.

2: Use the defer keyword while calling the JavaScript.

3: Check the Adobe Launch script.

4: Use the lazy loading feature for the different core components.

5: Enable minification in production.

 

Anything else, we need to take care?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

@Mahesh_Gunaje 

 

Please refer to this article "AEM Performance Optimization: Best Practices for Speed and Scalability"    by @Anmol_Bhardwaj 

 

 

   Here are some additional steps you can take to enhance page performance:

  1. Optimize Images:

    • Apart from checking image file sizes, consider using responsive images and the appropriate image format (e.g., WebP).
    • Leverage AEM's Dynamic Media capabilities for image optimization.
  2. Caching Strategies:

    • Implement caching at different levels (browser, CDN, and server) to reduce load times.
    • Utilize AEM's caching mechanisms, such as Dispatcher caching for static content.
  3. Minimize HTTP Requests:

    • Reduce the number of HTTP requests by combining CSS and JavaScript files.
    • Consider using sprites for small images.
  4. Review and optimize AEM component rendering logic.
  5. Utilize AEM's indexing and query capabilities effectively.
  6. Browser Caching: Set appropriate cache headers to enable client-side caching.
  7. Monitoring and Profiling:
    • Use AEM and third-party tools for monitoring and profiling to identify performance bottlenecks.
    • Regularly analyze logs and performance metrics to proactively address issues.
  8. Responsive Design: Ensure that the website is responsive and performs well across various devices and screen sizes.
  9. Optimize AEM Configuration: Review and optimize AEM configurations, including thread pools, connection pools, and other settings.

 


Aanchal Sikka

View solution in original post

1 Reply

Avatar

Correct answer by
Community Advisor

@Mahesh_Gunaje 

 

Please refer to this article "AEM Performance Optimization: Best Practices for Speed and Scalability"    by @Anmol_Bhardwaj 

 

 

   Here are some additional steps you can take to enhance page performance:

  1. Optimize Images:

    • Apart from checking image file sizes, consider using responsive images and the appropriate image format (e.g., WebP).
    • Leverage AEM's Dynamic Media capabilities for image optimization.
  2. Caching Strategies:

    • Implement caching at different levels (browser, CDN, and server) to reduce load times.
    • Utilize AEM's caching mechanisms, such as Dispatcher caching for static content.
  3. Minimize HTTP Requests:

    • Reduce the number of HTTP requests by combining CSS and JavaScript files.
    • Consider using sprites for small images.
  4. Review and optimize AEM component rendering logic.
  5. Utilize AEM's indexing and query capabilities effectively.
  6. Browser Caching: Set appropriate cache headers to enable client-side caching.
  7. Monitoring and Profiling:
    • Use AEM and third-party tools for monitoring and profiling to identify performance bottlenecks.
    • Regularly analyze logs and performance metrics to proactively address issues.
  8. Responsive Design: Ensure that the website is responsive and performs well across various devices and screen sizes.
  9. Optimize AEM Configuration: Review and optimize AEM configurations, including thread pools, connection pools, and other settings.

 


Aanchal Sikka