Project – Gray and Sons audit

Lighthouse report

Slugs List:

Home Page - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app/9hytfmdku2?form_factor=mobile

1. about-us - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-about-us/5v305txw5k?form_factor=mobile
2. all-watch-brands - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-all-watch-brands/xqk4xp06nn?form_factor=mobile
3. blog - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-blog/8dstc1b631?form_factor=mobile
4. catalog-request - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-catalog-request/4mn91ka2ln?form_factor=mobile
5. checkout - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fcheckout%2F
6. checkout-thank-you - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fcheckout-thank-you%2F
7. contact - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fcontact%2F
8. contact-info-submitted-thank-you - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fcontact-info-submitted-thank-you%2F
9. email-signups - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-email-signups/7rmxzwbjhw?form_factor=mobile
10. ez-ship-box-request-form - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-ez-ship-box-request-form/op4hifsicm?form_factor=mobile
11. glossary - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-glossary/h5qb8a5k9k?form_factor=mobile
12. grayandsons-fanclub - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-grayandsons-fanclub/o174545v5c?form_factor=mobile
13. news - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-news/1bc4l963xa?form_factor=mobile
14. pop-up-question-submission-result - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-pop-up-question-submission-result/37bh3g9211?form_factor=mobile
15. repairs - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-repairs/kwswg5vh2b?form_factor=mobile
16. testimonials - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-testimonials/fceg7cm7l6?form_factor=mobile
17. thank-you-catalog - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-thank-you-catalog/1umhh7mq7m?form_factor=mobile
18. fine-watches - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-fine-watches/v1ci798xrf?form_factor=mobile
19. jewelry - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-jewelry/mc4cneekoe?form_factor=mobile
20. jewelry/estate-jewelry-and-vintage-jewelry/bracelets-and-bangles - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-jewelry-estate-jewelry-and-vintage-jewelry-bracelets-and-bangles/tnr1pgbz31?form_factor=mobile
21. jewelry/estate-jewelry-and-vintage-jewelry/jewelry-sets - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-jewelry-estate-jewelry-and-vintage-jewelry-jewelry-sets/ynzm6b1jfd?form_factor=mobile
22. s520548-gia-certified-marquise-cut-diamond-4 - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-s520548-gia-certified-marquise-cut-diamond-4/2i5c7v9j9q?form_factor=mobile
23. n516242-david-yurman-renaissance-double-cable - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-n516242-david-yurman-renaissance-double-cable/mubuuijwnd?form_factor=mobile
24. w526680-hublot-m-d-m-28mm-13913-054 - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-w526680-hublot-m-d-m-28mm-13913-054/5bw6aochl9?form_factor=mobile
25. accessibility - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-accessibility/1pbcx109bu?form_factor=mobile
26. availability - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Favailability%2F
27. bitcoin - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-bitcoin/55ou3gohls?form_factor=mobile
28. buying-diamonds-online - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fbuying-diamonds-online%2F
29. blog/gray-and-sons-jewelers-features-top-of-the-line-orbita-watch-winders - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-blog-gray-and-sons-jewelers-features-top-of-the-line-orbita-watch-winders/o6s0vzqn64?form_factor=mobile
30. blog/the-exclusive-blancpain-leman-tourbillon-perpetual-calendar-2652 - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-blog-the-exclusive-blancpain-leman-tourbillon-perpetual-calendar-2652/mro7vbmdi6?form_factor=mobile
31. blog/buying-vintage-pre-owned-rolex-watches - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-blog-buying-vintage-pre-owned-rolex-watches/d7iktdiqv2?form_factor=mobile
32. a-lange-sohne-watch-repair https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-a-lange-sohne-watch-repair/sshvmbj393?form_factor=mobile
33. baume-and-mercier-repair-blog - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fbaume-and-mercier-repair-blog%2F
34. crown-replacement - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-crown-replacement/czhnct32ey?form_factor=mobile
35. crystal-replacement-rolex-cartier-patekphilippe - https://pagespeed.web.dev/analysis?url=https%3A%2F%2Ffabulous-gecko-88393f.netlify.app%2Fcrystal-replacement-rolex-cartier-patekphilippe%2F
36. diamond-bracelet-case-bezel-repair - https://pagespeed.web.dev/analysis/https-fabulous-gecko-88393f-netlify-app-diamond-bracelet-case-bezel-repair/php23gmsih?form_factor=mobile

Issues

Important

• Update inline images with gatsby-transformer-remark and gatsby-plugin-image or use implementation we made last year for sell us your jewelry website:

https://github.com/gall314/GrayAndSonsReactECommerce/pull/5

https://www.gatsbyjs.com/plugins/gatsby-source-strapi/#rich-text-field

• Check livechat packages, test react widget instead JS api scripts.

https://www.npmjs.com/package/@livechat/widget-react

https://bundlephobia.com/package/@livechat/widget-react@1.3.2

Use facade icon to and load only when user clicks it

https://developer.chrome.com/docs/lighthouse/performance/third-party-facades/

Example:

https://github.com/calibreapp/react-live-chat-loader?tab=readme-ov-file#-adding-a-provider

• Update IconsProductPreloader.js component to load only icon

I see this component even on home page but it seems like never used and lighthouse mentioned that

• Check graphql queries to use correct sizes for images when we have cards listing and or pre-optimize images:

https://www.gatsbyjs.com/docs/preoptimizing-images/

Related pages:

https://fabulous-gecko-88393f.netlify.app/blog/ https://fabulous-gecko-88393f.netlify.app/all-watch-brands/ https://fabulous-gecko-88393f.netlify.app/jewelry/

reduce quality to increase performance

gatsbyImageData(width: 150, height: 150, quality: 50)

• Use Partytown for these analysis scripts:

https://partytown.builder.io/gatsby

https://www.gatsbyjs.com/blog/how-to-add-google-analytics-gtag-to-gatsby-using-partytown/