Mobile Optimzation Performace

Developer Support
1

Hi, I am actually stuck while optimization of the project in mobile view specially. The performance score is around 40-56 out of 100.

I am using plasmic alongwith Next.js, where Next is being used only for creating some components which we are using in plasmic. The whole pages is being built in plasmic. I am using next/image and setting its fetchPriority wherever needed and lazily loading wherever needed. We have integrated Sanity project as well from where we’ll be fetching some blog content.
This is the website - Blogs
Following are the snapshots of the page speed analytics from https://pagespeed.web.dev website.

image
image1064×720 61.1 KB

image
image1024×480 30.4 KB

image
image977×704 51.6 KB

image
image989×708 43 KB

This is another page → Blog detail page

image
image1364×764 69.1 KB

image
image1123×711 50.3 KB

image
image1091×707 71.2 KB

image
image984×609 43.7 KB

Can anyone help me optimize it more so that I can atleast reach to 90 for performance score?
Also I wanted to know the maximum performance score of the website that they have built through plasmic.
Please feel free to give advice if any related to optimization.

2

Hi @pritika_acharya , I took a quick look.

Are these pages using Plasmic? I did not see any Plasmic elements in the pages.

The biggest issue is that the site is not pre-fetching and pre-rendering the fetched data, causing everything to happen only after it loads in the browser.

How are you integrating with Next.js? If you follow our quickstart here, the extractPlasmicQueryData step should ensure that you are doing the prefetching at SSG/SSR time. Get started with Next.js | Learn Plasmic