Sometimes when I open a page, it has blank only, but when I refresh the page or the browser, the page can be rendered.
I want to know why it happened and how the problem happened so much!
Some code from your HTML could be helpful but this is what I'm thinking:
It may have something to do with the order in which you are including your JS files. Be sure to load ext-base.js then ext-all.js before your own javascripts. You will then need to load any other resources required for your layout to render.
I'm thinking that on the first (blank) load, it fails to load the screen because of the resources are not coming in at the right time. When you reload the page, the scripts load because they have already been cached by the browser.
Related
I'm having a weird problem that I originally just dismissed as a development glitch, but now I'm more concerned because It happens every time I refresh the page.
The issue is when I navigate to another page (localhost:3000/otherpage), sometimes it wont render that page at all. The page will turn completely white and have no HTML elements on the page (according to the dev tools inspector). However If I'm on that page and refresh this will always happen. Theses pages are dynamically rendered pages that have logic written that tells them to load a skeleton page while fetching the data, or render an error page if there's a problem with the request. I'm stumped as to why this is happening and have not been able to find anyone else that has experienced this problem yet.
My question is:
Why does this happen? and how can I work around this?
I have a screen recording to better explain whats going on.
(link to unlisted video):
https://youtu.be/mJPp3P4ElsI
is it possible to load web page in background using javascript/jquery? I mean load DOM, run all scripts, load all dependencies (CSS, external JS libraries). I don't want to load HTML and replace it. It's easy to do but will cause all styles/scripts to be loaded after replacement, not before (as far as I know).
The reason is that page loading time is 10-20s and I don't want page to freeze during loading content. There is single JS script which takes 2-4s to initialize. The idea is to show some placeholder page like "page is loading, please wait" and load everything in background.
I know page should be rebuilt so it doesn't take so much time to load but it's not possible in page owner's budget.
EDIT: I thought about loading page in iframe and then move iframe's content to the main body. Would it work? Wouldn't I loose some JS/Jquery data, pointers to DOM elements etc.? Wouldn't it cause to reload all JS?
I am having a strange problem i.e., when I am opening my website a loader is loaded and then homepage displays. Now I am navigating from home page to different page, everything is fine . The problem arises when I am getting back to the home page the loader is again loading.
In normal situation it should not load. Not able to find out the reason. I am running the website locally so cant provide the url
window.onload() I have used.
The Window.onLoad() event ALWAYS triggers when the page finishes loading.
http://www.w3schools.com/jsref/event_onload.asp
What is the reason to think that going to your page won't trigger onLoad() the second time? The browser won't know the difference whether it is the first, second, or 500th time.
I have this formula: ({\Delta ^{ - 1}} - T{V_0})
It works perfectly fine when I open the 1st the webpage. As soon as i refresh or open it again, the formula is diplayed in it raw format.
When I remove the browser cache, it work again the next time.
Any idea?
I have tried with Firefox, Chrome.
Thanks.
If you have in-lne configuration, make sure it is before the script tag that loads MathJax.js itself. If it comes after, MathJax may not be able to locate it when it needs it. This can happen when MathJax is in cache, as MathJax can get to the point where it looks for the configuration earlier, and the configuration block might not be available in the DOM yet. So make sure it comes first, as documented.
Thanks for your help Davide, but I figured out what the problem was. In fact, one part of the page was loaded with Ajax, so mathjax was running before the page was loaded. What happened from time to time, is that when I cleared the cache, the ajax page was loaded a bit earlier that the mathjax script, so it worked. What I did is that I reloaded mathjax once the ajax page was loaded and everything works as a charm.
MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
I have a web application that uses quite a bit of JavaScript.
When the page loads, it's very clear visually that something is blocking the rendering of a particular portion of the web site. This portion is generated by a Tabber Tabify JavaScript library.
How can I determine what's blocking the HTML rendering specifically so that I can modify my code to prevent this blocking?
Can I use Firebug, or some other tool, to walk through my HTML/JavaScript to determine where the HTML rendering is being blocked and if so, how?
UPDATE:
YSlow gives my web-application a score of "A" and Page Speed give a score of 94/100.
UPDATE 2:
The live site is linked below.
http://www.elite.com
What I'm specifically referring too is the actual Tabs themselves being rendering (and NOT the panel content inside the tab panes). It seems strange to me that the Tab headings themselves are taking so long to generate on the first (empty cache) page load.
A few possibilities:
Loading scripts in your page will block rendering (the only fix for this is to put them in the head (blocks initial rendering) or at the end just before the </body> or load them after the page is loaded (e.g. onload)
Whatever the Tabber/Tabify tool is, needs time to process content... see if there is a way to optimize it.
Either way, if you post some code we can likely be of more help
Update:
If I load the page with my cache cleared, I see content rendering on the screen, then hiding (as it becomes hidden tab content)
Changing the non-visible content to display:none; when loading, and then only setting it back to display:block; once the Tabify stuff is done might help (a) speed up the rendering and (b) remove any flash of content that later gets hidden.
The RadComboBox'es you have load inline (which means the scripts block rendering)... if you can delay this until the onload event fires it will speed up rendering.
I would move the Unica Page Tag (tracking) to the end of your page too.
You have 8 external script files - if there is any way you can combine them it would be good.
You don't have gzip turned on for most of those script files
All of your static content (images, css, scripts) don't have an expires header which means they won't get cached, which means pages won't load fast after the first page.