I try to optimize the website https://www.onwalt.de
When I use Lighthouse within the Google Chrome DevTool, I get really good results and a time of 0.9 seconds for the Largest Contentful Paint (LCP) in desktop mode and a LCP of 2.3 s in mobile mode.
However, when I use PageSpeed Insights the LCP goes up to 8.2 seconds for mobile devices:
https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwww.onwalt.de%2F&tab=mobile
I get the same bad results with https://web.dev/measure/
Could anyone explain the difference?
I cannot find the reason. Yes, there are some render-blocking resources, but they cause max. 2 seconds.
What am I doing wrong?
The option "clear storage" is enabled:
Related
I'm optimizing my website and attempting to enhance the Largest Contentful Paint, but the only item that appears to require work are the optimised CSS files made with W3Speedster; here is a link to the Google speed test I performed. I want the LCP to be less than 2.5.
Any advice would be greatly welcomed; thank you!
That does not mean it takes over 3 seconds to render the content.
The rendering of you page from start render to document complete is only about 0.100 seconds.
You server is your biggest problem. It's slow.
The best thing you could do for your pages is either eliminate shareaholic.js, or get it to load sooner. It appears there may be some sort of lazyload. I does not load until 1.8 seconds. That is likely the reason the page rendering starts too late. That and too many font and CSS files. The Browser cannot begin rendering and till it has all the CSS and font files. shareaholic.js is your 15th file being loaded. There are 5 images being prefetched before this js.
You need to get the page to start rendering sooner. You could join some of the CSS files together to reduce the number of files being retrieved.
It's just your ads. :)
You'll most likely not be able to make it any faster. Maybe a little bit. I reduced it from 4 seconds on Cloudways Nginx servers to under 2 seconds on WPX Apache servers.
The problem is, when your ads are loading in the beginning a bidding war takes place. It's only after this they can load in the ads. So it'll always take time.
If I were you, I'd change the host to something like WPX, they will also help you make it as optimized as possible, with ads. If not changing the host, I'd focus on the CLS. Much bigger factor and easier to do something about.
I have developed a mobile site using Icefaces-mobile framework in that I want to search the things based on area zoomed in on the mobile screen, for this users can zoom in/out & navigates the area but the problem is after doing zoom in/out/navigations 4 to 6 times browser becomes unresponsive. I think it must be problem with browsers capability of handling/execute the javascript(correct me if I m wrong).
I have generated latest API key for map using some standers steps given by google on their forum.
Thanks in Advance.
The stock Android browser does suffer from serious limitations, and it could be device performance limitations, as the previous poster mentioned. But you should also be careful that you're not inadvertently causing a memory leak in your own JavaScript. Are there DOM updates from Ajax interactions being generated during this? Check the Android LogCat messages to see the ICEfaces/ICEmobile logging which will show the updates. Check to ensure that if you're custom function is being re-run that you're not causing a memory leak there. If not, I doubt there's an issue with the GMap code and it's likely just a device limitation. Perhaps also put your gmap code in a separate HTML page without ICEmobile and see if you still have the problem.
I have a simple application that plays microphone - the code is taken from :
http://my.safaribooksonline.com/book/programming/android/9781449308001/exploring-the-apis/microphone#X2ludGVybmFsX0ZsYXNoUmVhZGVyP3htbGlkPTk3ODE0NDkzMDgwMDEvNDY=
This sample works fine on Ipad 2 but not on Ipad 1 (inconsistent behavior, sometimes plays a few seconds and breaks).
was anyone able to use the microphone on Ipad 1 (developed with flex 4.5.1), I need a very simple thing - record voice and play it
Thanks
Try increasing your buffer size for playback. This is located in the playSound function and in the example it is set to 8192 which should be more than enough. Try 16384 and see if that fixes it. Please note that this may make your playback seem to be delayed.
Are you compiling this application in Debug or Release mode to test? Sound playback is usually choppy in Debug mode and performs significantly better in Release.
I was wondering if anyone can help me out. I've got a page that shows about 260 images so it obviously takes a long time to load. I've noticed a lot of the time in Chrome it takes too long to load, and by too long I mean it appears to be unresponsive.
Safari on the other hand seems to load the page up pretty quickly.
So I am left here wondering is there something that exists in the lifecycle of a chrome http request that would be trying to pre-load the images or something to that effect which is causing the delay.
Both browsers are working from an empty cache.
Can anyone enlighten me!
The network tab on the chrome developer tools will let you see the order the images are loading in, and the average time fetching each from the server. I've seen issues where a certain higher res image can cause a browser to stutter a bit when rendering the page (usually IE :s), so this might help you pinpoint if its a particular image causing the issue.
http://code.google.com/chrome/devtools/docs/overview.html
Back in the past,
i found a third party webpage that was able to capture and save images of my website in different resolutions and browsers. Of course i have no more that bookmark...
So is there any webpage or application where i can see how my webpage looks like in different resolution?
And here are the resolutions i would like to check for..
1. 1024x768 24.56%
2. 1280x800 22.06%
3. 1280x1024 13.42%
4. 1366x768 7.10%
5. 1440x900 6.68%
Perhaps you're thinking of http://browsershots.org/ ?
Note that the screen resolution of the computer running the browser is only half of the truth. If the browser isn't maximized, it will be a lot smaller than the resolution you see there, and on non-Windows operating systems (Mac OS X, Linux) it's a lot more common to run applications non maximized.
It's simply best to make sure that your site is viewable in anything from small windows (just resize your browser down) to large.
If you want to check various resolutions and browsers, then BrowserShots may have been what you came across before, give it a look.
For viewing which percentage of people sees how much of your web page:
http://browsersize.googlelabs.com/
Also: Web Developer plugin for Firefox (Resize menu).
Chrome Extension and Firefox add-on to resize your browser to various standard resolution sizes...
There is one more online tool called ScreenFly which is very good and you can even check for tablets, TVs, mobiles.. screenfly
There are many utils available for watching your website in different resolutions.
Some are installed on PC, some are online services like these:
Adobes "render browser" - you'll need to create a free Adobe account:
http://browserlab.adobe.com
Nice, but not free if you want it fast as I recall it:
http://browsershots.org/
Google - shows what part of your website is visible based on statistics from Google:
http://browsersize.googlelabs.com/
But as far as I know, todays most commonly design resolution is 1024x768, eventhough the height isnt that important because of the popular scrollwheel on most mice/pads.
If you design to design for this resolution there is a lot of design help in the "growing standard" called 960 grid, which is based upon how many professional designers build a design.
You always make an invisible "grid" and then you use the cells to arrange the contents. Much like the old "table" system, but much more focused on professional designs.
Regarding your question, the % you list, seems like you would have most use of the "Google" link above.
Lastly, always remember to test how your website looks with the most used browsers. For me those 4 will be:
Internet Explorer (latest and previous version, use more than one computer to test if you cant do a double installation of it)
Mozilla Firefox (latest and perhaps previous.. but they make less changes in the render, so latest would be ok)
Google Chrome (awesome debugging tools too, and a very stable browser)
Safari (so you make sure that you support MacOSX)
Thats my opinion.
The Multibrowserviewer is a great (paid for) tool for multi browser support, I know it's not free, bt worth looking into even just for the trial period.