Is there a way to alert a visitor that the website may load slowly because of their slow connetion?
i.e.
Heads up!
The page seems to be loading slowly becasue of your connection. Please allow extra time for the website to load.
You may download a known payload using ajax. Note down the request begin time and end time. If that is beyond some threshold you may alert the user about slow connection. For example, you download a 100 kb payload. You know under normal situations it takes 2 seconds. You may alert the user about slow network if it goes beyond acceptable threshold of say, 5 seconds. The payload you download need not be a waste request - you may use any ajax request for detecting the slow connections. This will work with one big assumption - your server is always responding quickly under heavy loads too - indicating only source of slow response is because of user's network conditions.
Related
Chrome Timing View
The image above show chrome spends most of the time queuing up the request. I am trying to figure out why that is happening to minimize it.
According to chrome developer documents:
A request being queued indicates that:
The request was postponed by the rendering engine because it's
considered lower priority than critical resources (such as
scripts/styles). This often happens with images.
The request was put on hold to wait for an unavailable TCP socket that's about to free up.
The request was put on hold because the browser only allows six TCP connections per origin on HTTP 1.
Time spent making disk cache
entries (typically very quick.)
Number 3 seems to be the most likely problem according to chrome developer documents but I know that only one request is going out at a time so that can't be it. I don't think it is number 1 either because the performance monitor doesn't show a lag from rendering. Maybe it is either 2 or 4 but I don't know how to test that.
Chrome Performance Monitor
I've included a picture of the performance monitor that shows these long tasks where something is happening in the system. These are also a mystery to me and seem related.
Any help is greatly appreciated!
Edit: It seems you can disable the disk cache when you open dev tools and that didn't seem to fix the problem.
I am running performance tests on a webpage and I noticed the network tab of Chrome DevTools has a summary bar at the bottom with number of requests, bytes transferred and finish time. I would like to console.log (or even better log to a file) these values at the end of each test.
I do see a chrome.loadTimes() which has the timing info. Is there something similar to retrieve number of requests and bytes transferred?
Check out the Resource Timing API. It can give you a whole bunch of info on every resource that a page requests. And it's got good cross-browser support, so you can use it to collect some Real User Metrics on your page's load performance in the wild.
I have been using navigation timing api to collect actual user data about my site performance. Basically, every time a user visits the site, I send this data back to server and store it in the db.
Now that I analyze this data, I am finding that domainLookupStart is abnormally high even when there are no redirects happening. On average, over 3 months of data, its as high as ~400ms. This is making up for majority of my "Time to first byte".
I was wondering if someone has a better understanding of what work happens before the browser fires the domainLookupStart navigation timing event. And is there something I can do to bring this time down?
It can sometimes be the unload event on the previous page. The unload event allow some JavaScript execution before the page is closed, and it's often used by tracking scripts to save the time spent on the page by users. I've even seen a script sending a synchronous ajax requests here!
It could be on your page or on a third party page that drives users to your website.
You can use Chrome DevTool's Performance tab (previously called "Timeline") to record what's going on during unload and maybe you'll find something.
This is a screenshot of Chrome's network timing and I'm trying to figure out the "stalled" time of ~250ms. Google's docs say the stalled status is for time spent either waiting for a socket (possibly due to max 6 rule) or time spent negotiating a proxy. However, in my case, this is the only active request (so it's not a max 6 issue), and there is no other network activity on the computer or even the network. I'm also not using any form of proxy or VPN.
I eventually figured out that this "stalled" time disappears if I change from https to plain http, so at first, I figured this was SSL setup time. But if that were the case, why isn't it showing up in the "SSL" section of the timing?
What's causing this "stalled" time taking 30% of the load time?
Edit
I had my buddy on the opposite coast hit the same page and it's worse for him, which suggests that it could be server-proximity related?
HTTPS
HTTP
I have been searching to see if it is possible to include a script that will push a low bandwidth version of a web site for those who have dial up. There are two sites (one with lots of JS, images, code, etc.) and a site that is limited. I would like those who have dial up to view that page instead of the slow loading page.
Is there a script for this?
Thanks.
You could send the client a tiny ajax script that calls back the server. The process can be timed and you can make your decision based on the result time. However some time will be lost in the process, but the time saved for the slow browser could be significant.