List of Reasons for Poor LCP, How to Optimize in Magento 2

1
www.vihadigitalcommerce.com
2
About VDC
Over 8 years 1800 projects, VDC is a full
service ECommerce Web Development Online
Marketing Agency that provides value added
services at affordable rates to numerous small,
medium large size of businesses across the
world. Deliver 247 uptime and responsive
digital commerce solutions that allow businesses
to offer remote access of their professional
offerings. VDC is an offshore web development
online marketing center with agile approach of
development.
www.vihadigitalcommerce.com
3
List of Reasons for Poor LCP, How to Optimize in
Magento 2

• The LCP metric is used to determine how long it
  takes for a pages largest above-the-fold element
  to appear within the viewport
• This is usually an image such as a banner, a
  carousel, a video, or a product image
• Magento merchants should strive for a Largest
  Contentful Paint of 2.5 seconds or less to
  deliver a better user experience.
• Anything between 2.5 seconds to 4.0 seconds needs
  improvement and any LCP loading speed above 4.0
  seconds is poor
• The following are the most prevalent causes of a
  poor LCP for Magento stores
• Slow Server Response Time
• Rendering-blocking JavaScript and CSS
• Slow resource loading Times
• Client-side Rendering

www.vihadigitalcommerce.com
4

• Server response times are slow
• Even if other resources are optimized but your
  server is slow then it will be difficult for you
  to score high at search engines
• The problem could be caused by bad web hosting, a
  lack of cache, unoptimized database queries, or
  API replies that are just taking too long to
  process
• JavaScript and CSS are rendering-blocking
• If you just keep on adding new plugins to your
  website or choosing a heavily designed theme, you
  might need to reconsider them
• The loading of a web pages main content may be
  delayed by JS and CSS files in your Magento
  store. Usually, such files size is larger and so
  it takes more time to load
• Slow loading of diverse resources of the web
  page
• LCP performance may suffer as a result of the
  time it takes to load images, videos, text
  blocks, and other resources of your Magento store
• Large images and videos need to be optimized for
  optimizing the LCP of your Magento store

www.vihadigitalcommerce.com
5

• How to optimize LCP in Magento
• In terms of Largest Contentful Paint, we can use
  one of the following tools to determine it
• Page Speed Insights
• Chrome User Experience Report
• Search Console (Core Web Vitals report)
• Webpage Test
• web-vitals JavaScript library
• Optimize Server response time
• You can improve your TTFT BY
• Upgrade your server infrastructure.
• Analyze and improve the efficiency of your
  back-end code
• Route users to a nearby CDN
• Enable caching
• Configure Nginx

www.vihadigitalcommerce.com
6

• Reduce Java-script Blocking Time
• This can be accomplished by using the following
  techniques
• Moving JS files to the bottom of the ltbodygt
• Using JS bundling
• Deferring non-critical JavaScripts
• Moving inline scripts to an external JS file
• Avoid Using Lazy Loading for Above-the-Fold
  Images
• Excluding the LCP element from lazy load can make
  your LCP score low. So it is recommended to
  optimize the size of the largest image utilizing
  standard ltimggt or ltpicturegt tag.
• Image Optimization and Compression
• Remove unnecessary images from above-the-fold
• Compress images, so they load faster.
• Switch to modern image file formats.
• Use an image CDN

www.vihadigitalcommerce.com
7

• Optimize CSS
• There is no need to switch to development mode as
  you can easily merge and minify CSS files from
  the production model. It can be done by typing
  the following commands
• php bin/magento configset dev/css/merge_css_files
  1
• php bin/magento configset dev/css/minify_files 1
• Replace Google Fonts with System Fonts
• When you download Google fonts, the entire layout
  gets repainted
• This repaint lengthens the time it takes LCP to
  load
• It is preferable to use system fonts such as
  Helvetica or Arial for optimizing the Magento
  store speed
• Turn a Logo Icon Fonts In into SVG
• As long as SVG components are not required to
  compute Largest Contentful Paint, switching the
  logo and icon fonts to SVG avoids an unnecessary
  request
• Furthermore, converting these online elements to
  SVG may considerably increase your Cumulative
  Layout Shift score

www.vihadigitalcommerce.com
8

• If you are still facing issues in optimizing LCP
  of your Magento store, then please reach us at
  Viha Digital Commerce or email us at
  info_at_vihadigitalcommerce.com
• Also read Speed Up Magento With Googles Core
  Web Vitals

www.vihadigitalcommerce.com
9
Read the complete story follow the link
below- List of Reasons for Poor LCP, How to
Optimize in Magento 2 Read Blog
https//www.vihadigitalcommerce.com/blog/
www.vihadigitalcommerce.com
10
LET'S GET TOGETHER Start Discussion About Your
eCommerce Development Online Marketing Hassle-f
ree One Stop Solutions, Hire Us!
Website www.vihadigitalcommerce.com Skype
bdo3.magentoguys Email info_at_vihadigitalcommerce
.com Call 91 7096620202