Delay in Website Loading in Page Insights - pagespeed

Please check this Screenshot: Page Insights Image
I have marked in it. I have 2 Questions:
Why the website is loading after 4-5 Slides in the Page Insights.
Why the FID is not fetching in Page Insights.
Thanks

Could be any number of reasons. A few slides of non-content are expected for most sites. The filmstrip is suppose to show how it loads (in your case the menu loads first, then the image), rather than how slowly it loads. The stats above are more important but they do show it being slow. Page speed insights will give plenty of advice and guidance on improving your performance below the filmstrip.
FID is a measure of how long it take from interaction (I.e. clicking on a button) until that interaction is processed. Many static, content, sites (e.g. newspapers, blogs and other articles) will not have an interaction (scrolling don’t count as interactions for FID for example) so it’s perfectly normal for there to be no FID score there. In this case FID is ignored in terms of whether you pass or fail Core Web Vitals so no FID is effectively the same as a passing FID.

Related

Lowering Largest Contentful Paint, Over A Full Second After FCP On Mobile

I've spent quite a bit of time on performance optimization for my site and I'm right there at the finish line for getting all the green good scores in search console for mobile usability and core web vitals. The last outstanding thing is getting my LCP under 2.5 seconds for my blog posts.
I'm consistently getting 2.6-2.7 and I can't quite figure out why. The LCP element is the <h1> tag on my blog posts and there are no above-the-fold images.
Example URL With Higher LCP
Let me say that I am using a Beaver Builder website and some marketing tags like GA, GTM, etc but I've spent a lot of time analyzing my script and style loads to create an optimal experience with preconnects and preloads of various resources. I know it's a big ask to try to get a site like this down in load time. I'm on Kinsta hosting with low TTFB, full-page caching and CDN. I am also using the Perfmatters plugin to control various aspects of load times.
I've done everything I can think of to get the LCP down and it seems like the <H1> tag is visible almost immediately but then may be repainted later towards the end of the page load, but I can't figure out the cause of this.
Anyone out there feeling generous that could take a look?
Page Speed Insights URL
as i can see Pagespeed is showing aggregated real user experience of your entire domain, not of this specific pages but for all pages on this domain.
DOM content load time for your page on mobile is around 3sec, that means your LCP has to be greater than this
You need to reduce your DOM content load time first. You need to prioritize your network calls such that redundant dependency needs to be minimized
And also for desktop page, you are lazy loading first fold image which is not considered as a good user experience and might be contributing to LCP for desktop version of your page, also impact negatively for your SEO

First Input Delay and Interaction to Next Paint showing N/A in the google pagespeed

I am checking my website on google PageSpeed and getting 97 scores. Also, core web vitals is also showing passed.
But why I am getting First Input Delay and Interaction to Next Paint N/A?
Is there any issue with my code or do I have to change some settings?
No all pages will have any interaction from users. For example a simple blog site, may just have readers who open the article, scroll (which doesn't count toward FID nor INP) to read the page, and then leave the page happy.
FID and INP are therefore optional in terms of Core Web Vitals - as you say your Core Web Vitals Assessment still says: Pass.

How to fix Core Web Vitals FID issue in Asp.Net?

I have created an E-commerce based web application in Asp.Net(Backend: Vb) with a BVcommerce tool which is working absolutely fine but due to new guideline of google for page ranking and SEO application has to pass Web Vitals Test so I have changed some of my code and now Largest Contentful Paint (LCP) & Cumulative Layout Shift (CLS) passes with more than 85% percent but when talks come to First Input Delay (FID) it passes only 40% so can you please help me to solve that.
I have also tried to remove all homepage content(Images, Menu and Footer) but still, the results are the same as earlier.
In my application, there is all page load mechanism because it created 4years ago so it creates an issue. I also attach result image here.
Can anyone have an idea about this then please let us know.
First Input Delay (FID) is a pure real user metric and measures the delta between when an input event is received and when the main thread is next idle to execute that event, hence the main thread blocking time is directly proportional to this metric score
The web vitals suggests some good optimizations to improve this score:
Break up Long Tasks
Optimize your page for interaction readiness
Use a web worker
Reduce JavaScript execution time
It all goes to the main thread optimization at the end - an approach idle until urgent is the best in terms of optimizing the performance, hence the lighthouse score. Try reducing non-critical network requests for resources (CSS and JavaScript files) loading over the main thread and instead load them asynchronously
Image heavy pages are better optimized by determining when the media item has entered the user’s viewport and fire an event, this is achievable by Intersection Observer API, hence a lazy loading methodology used by modern mobile first frameworks for better user experience

Adobe Target, placing user in experience based on URL contains

If I have an Adobe Target experience that shows content in Experience A to 50% of users and content in Experience B to the other 50% of users...how can I insert someone into one of these two experiences?
I was thinking of having a button the user can click that has a url parameter added to it for example ?exp1, and then a different button that would have ?exp2.
But if I use the refinement 'url contains exp1 or exp2' in each of the experiences in target, then that is only when the mbox will fire. Whereas I want them to fire on the original page that the mbox is on.
Any help is greatly appreciated...thank you all!
Adobe Target will serve up your two experiences without having a user click a button. You can have experience A hard coded on your site. Then when you go to make your Target A/B test just enter the URL in the first pop-up box that asks for the activity URL.
Then on the next page Experience, A should be what was hard coded and live on your site. Select experience B and code up your second experience. When done you will select your audience - most likely all visitors and then make sure your set to 50/50 split.
This was a visitor will automatically be shown either A or B when they come to your site. The target mbox fires when the page loads and makes the decision who to show what to automatically. One interesting quirk with Adobe Target is that they don't send one customer to A then the next to B and the next to A as you may expect. Sometimes they send a bunch to A back to back before sending some to B. It works out to a 50/50 over time. And the first 24 hours of data may look a little funky as there is sometimes a latency in data being processed. Hope this help.

Google Experiments A/B Transaction Tracking

I am adding a step into the buying journey on an eCommerce retail website. I want to test to see if this affects overall conversion rates. Our platform doesn't support A/B testing itself so I'm hoping I can test this using Google Experiments.
A lot of examples for Google Experiments involve having a different page/url to test with, so you want to test a different button style or page layout, different content etc. In my case this doesn't apply as my test is a multipage test, if I add a step here how many of those customers end up on my order confirmation page. The business logic which determines whether to add the additional step is handled via javascript so essentially I want half of my visitors to load to old js file and half to load the new js file and then to see how they differ in Google Experiments.
I'm guessing the only way I can do this is to set-up an experiment where the original page would be
www.mydomain.com/product_page
and my variation page would be
www.mydomain.com/product_page?some_variable=1
Then in my framework I could check for that url parameter and load to new js file. But would that track through the whole buying journey once the customer has left that page?
Any help or suggestions would be very welcome.
Thank You
Saul

Resources