Web Performance - performance

Im working on a large site, trying to decrease the load times, and I have bumped into a rather strange issue. Im using google chromes built in developer tools, and I am finding that certain images are getting hung up, and the browser is continuing to look for them. Has anyone encountered this issue before? How do I isolate what is causing this problem?
The site runs a couple of ads, is it possible this error is occurring because of ad networks?
Here is a link to the actual problem: http://i.stack.imgur.com/IEtLA.png (updated)

If you have not done already, use a tool like http://www.webpagetest.org/ to test your site. It will test the site from nominated locations around the world, with the browser of your choice, and you will get waterfall charts for your page.

Just an idea.... If not yet done, try Google's free website testing and optimization tool 'Website Optimizer'. See what it tells you.
Another idea, try accessing the site with another browser, either one, IE, Safari, or FireFox, to see if you get the same issue; if you do then it may be the server for some reason not serving those images.
One more.... To isolate further, if possible, try using only few (one or two) images in your site/pages; if these load then add one or two more images until you encounter the issue, then that image has something and you may replace that image.

Related

Need basic step by step instructions to get Flexpaper on to clients website

Greetings o knowledgeable ones,
I may have bitten off more than I can chew and this is the reason why I'm here!
I'm a beginner/intermediate front end coder and I have a client who has asked me to use Flexpaper to view their PDF catalogues on their website.
I know little about PHP and server side stuff (hell, I barely know front end code) and for the life of me I cant find a step by step instruction on how to upload the viewer and the PDFs on to the website/server.
I've read a couple of answers on the website that give me a glimpse into what I need to do but they seem to fall short of a complete answer.
I tried to using the 'Server Publishing' option in my local machine (using MAMP) but got stuck half way through when permissions where denied. Then found an answer eluding to the possibility of publishing to the web using the 'FlexPaper Desktop Publisher Zine' So I downloaded that and published a PDF and now I have a folder that was created on my machine but I'm a little lost from as to what to do next?
Some specific questions I have:
Do I upload the whole folder to the server and if I do what is the
code I have to include on a web page to access this Flexpaper PDF?
Do I need to upload any other applications/helper files to make the
viewer work on the website?
I have multiple PDFs(approx 15) I need to upload - is using the
'Desktop Publisher' to create each PDF the best way to do this? Or
should I use the 'Server Publishing' solution?
Why have I charged my client so little for so much work!?
Flexpaper seems like a great option for viewing PDFs online but it seems to be lacking in a beginning-to-end process of how to implement it onto websites. Unless I am missing something....
I am not a smart man.
Thanks and peace

Debugging AngularJS web app in Firefox extensions

I have created a Firefox extension that loads an iframe. That iframe loads a web application built using AngularJS. Is there anyway to inspect what is going on? The application loads but I have 2 input boxes that I am unable to type in.
I've developed the extension in both XUL and using the Add-On SDK and both of them don't allow me to interact with the input box. I've further noticed that when I remove the ng-model attributes, interaction works. It seems like data binding is an issue.
Any ideas?
Thanks
Without seeing the code, it's hard to say what's going wrong. If I were running into this problem (and I've run into similar ones), I generally fall back to editing the Angular source, and adding dump (or console.log) statements to try and trace what's going on. It's pretty terrible, but it usually gets the job done.
Good luck!
This question is kinda old by now, but as a reference for people coming here from a web search:
you might want to look at this SO question that lists some things that can go wrong with AngularJS inside XUL extensions, together with some solutions.

Website is slow but cannot find culprit

I have a ski holiday website http://www.powderwhite.com which Google Webmaster Tools say is slow (70% slower than other websites on the Internet).
Problem is that Google Developer Tools say we have done 90% of what is required to improve speed, speed tests also show the site is fairly fast and other websites hosted on the same virtual server are faster.
I think we have done lots to the site itself to make it fast and the hosting provider is saying it is not their servers. Anybody know what may be wrong? (I suspect jQuery or some javascript is slowing the site).
Try using fiddler tool. You can launch this then open the website in IE and in fiddler you can see each of the elements loaded on the page. In the right window pane you can look at the statistics and inspectors to see if there is one image or file that is giving a slow response.

Why sometimes, some images on my website aren't being loaded by a browser

I'm developing a web app and during the tests I noticed that sometimes browsers don't load all images (like background or some decorative images) on the website. I need to hit the refresh button to to have it fully loaded. This usually happens when the website is visited for the first time.
I suspect that maybe the development server is not fast enough and browsers "assume" that the links to images are broken because there is no fast response from the server. But I'm not sure. At the moment my development server is on a remote host inside VirtualBox with Ubuntu-server 8.04. I know that it is not the best configuration, but I'm not sure whether this is indeed the case. Or maybe it is due to some apache/php configuration parameters?
I would appreciate any suggestions or clues.
Many thanks

How can I check my AJAX for browser capable?

I always have to check each and every browser to see if my website would work. Is there a website where I can check it with?
Update:
I don't really want just screenshots (which what browsershots do), I want to actually test the posting of my script.
You want a web site to check your web site for javascript compatibility? How would you expect it to know how to exercise your interface to trigger the proper interactions? Or are you thinking of it doing some sort of static code analysis? I think you are better off coding against a framework that has solved most of the browser-dependent idiosyncrasies and using it to check for browser capabilities before you use them. jQuery, MooTools, Prototype/Scriptaculous, etc. go a long way in solving these problems for javascript.
Note that you still need to worry about rendering your site, but you already have several answers for how to go about doing that based on web sites. Personally, I just maintain IE/Safari/FF/Opera/Chrome on my workstation and do significant checking in IE/FF and basic checking in Safari/Opera/Chrome.
Even when there exist websites that allow you to see a static snapshot of your site in several browsers, you should really test your page on them yourself, because there can be subtle, and not so subtle, bugs and differences that are only apparent when interacting with the webpage.
You can cover yourself quite a lot by testing in
A Gecko engine browser (Firefox)
A Webkit engine browser (Chrome, Safari, Konqueror)
Opera
AND IE6+
John Resig recommends checking the Yahoo graded browser support documentation.
If you write unit tests for your javascript, you could use testswarm http://testswarm.com
There are multiple options:
http://ipinfo.info/netrenderer/
These site will let you run multiple browsers and version without installing. You only need to install a plugin
http://spoon.net/browsers/
There are plenty of sites, just Google/Bing for browser compatibility check.
http://browsershots.org/ is a good one.
Although most of them just take a snapshot of the site, you might have to do the manual check for things like menus and dynamic content.
BrowserShots might do what you want if you can tell by rendering a particular URL whether or not things will work as expected.
In light of your update, you could still use BrowserShots by creating a page which tests each of your scripts and renders 'pass' or 'fail' as its content depending on whether they work or not.
Failing that, Multiple IE is quite useful for running various versions of IE on one PC which can otherwise be problematic.

Resources