#font-face flicker on every page load in ie8 - internet-explorer-8

I know that a certain amount of text flicker or FLOUT (even if its unnoticeable) is almost inevitable with #font-face. However im having an issue with IE8 where the flicker occurs on every single page load. It seems that unlike other browsers the font file isn't cached at all. Why could this be happening and are there any solutions? Thanks

Ive managed to fix this by adding caching rules for this file in the htaccess.

Related

Page cache inconsistency across browsers

Ive done all my Wordpress development in Firefox and I am using a caching plugin called W3 Total Cache.
The only problem I'm facing is that in Safari and Chrome, my navigation is being reloaded each time a user works their way through the navigation, I understand this is how the web works, that assets and content are being reloaded with each click. But in FF, its perfect, the nav appears to stay in place while the navigation is extended underneath > see http://spunfilms.samuelcane.com/ then http://spunfilms.samuelcane.com/work and then that pages children. Have a look at the site in Firefox and then in Chrome/Safari.
Has anyone got any ideas why I'm getting this inconsistency across browsers?
Is there a way around it?
Thanks,
Red
By using W3TC plugin in Wordpress, I managed to optimize the site to make the page load almost instantaneous. My problem was that the plugin wasn't configured properly. I took a look at some other sites using the plugin and tried to configure it accordingly.

#font-face rendering performance

i'm building a site where we are considering to use a custom font (using #font-face) for all text on the site, not just the headers. I've already integrated a custom #font-face on another site for just the headers, which works fine, but i'm a bit worried about performance (especially rendering) when using a webfont for everything. Especially in IE, because you need this hack to fix anti-aliasing problems in IE7 and IE8.
Does anyone have any experience (or even better: test results) with deploying a large website while using #font-face for all fonts?
Update: i've been using web fonts for body text for over a year now and i've seen no performance problems.
#Husky,
I have been using #font-face embedded fonts for all the type for a while now and I have have not had any problems with rendering or performance.
Steve Sauders has an excellent article about website performance effects of #font-face
The clearfix hack in the article you referenced will slow down the site on all versions of IE. All the IE filters cause performance issues.
Using #font-face embedded font.
I had a particular font that slowed down the rendering; tiza_talk.ttf. Another font that had a bigger filesize was faster#rendering. The tiza_talk seems a 'big' (wide) font which might be the cause (idk). It was rotated text but not rotating it didn't speed it up.
Now I'm looking for an alternative font. Using another embedded font (still rotated) the loading time went from 50s to 15s..

Company logo partially visible. What could be wrong?

I was asked this question recently in an interview:
Company logo appears partially on
the new build of browser
Eliminated Server down problem, not network issue
Company Logo which is a JPG : maybe the image rendering broken
What else could be wrong?
I could not think of anything else. Please help. Can someone elaborate?
Thanks.
It could be that the browser software is not correctly dealing with objects that are split into multiple packets - acquiring the first packet(s) of a progressively loaded image and not the remaining ones could result in a partially displayed image.
The new build of the browser most probably changed their css rendering engine, adhered to new standards, etc.
What looks right in the old browser might not look right in the new browser simply because the rendering is changed. This is especially true with IE6 to IE7 and IE7 to IE8.

Internet Explorer 8 waits until page is completely rendered and javascript is executed

We have a pretty big web page with a bunch of javascript. When loading it in Firefox/Chrome, the page gets loaded gradually. First the html that already is received is rendered and shown and then the javascript gets executed.
Internet Explorer 8 however waits until the request is completely received and its javascript executed before it shows. This gives the impression that the application is unresponsive for a short period.
We have one laptop on which IE8 loads the page like Firefox/Chrome and we've been searching for a setting on IE8 to indicate that it doesn't have to wait until all javascript is executed before showing the page or part of it.
Does anyone have a clue if there is such a setting and where it can be found? We checked that the Chrome frame for Internet Explorer is not installed.
Update:
For more clarification, as #Thariama points out in the comments I also thought that IE8 always waits to render the entire page but seeing this laptop render it I am pretty sure that it loads the 'Firefox-way'. The laptop had half the RAM and CPU power a comparable desktop had and it looked and feeled faster (because of the rendering).
I ran into the same issue today when trying to determine why IE8 would render incrementally when loading from localhost, but wouldn't when loading from an intranet server.
The fix is to tell IE which rendering engine to use. I prefer to always have it render using the latest engine available.
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
...
The reason it was happening is because when loading from localhost IE was rendering with the IE8 engine in standards mode. When loading from the intranet, IE defaulted to rendering in compatibility mode using the IE7 engine. The IE7 engine would pause until the whole table was loaded before rendering, but the IE8 engine would render the table incrementally.
To check which mode IE is in for a particular page, hit F12 to pull up the developer tools, and in the menu area there's a "Browser Mode" which tells you which rendering engine it chose, and "Document Mode" which indicates quirks mode or standards mode.
I was recently tasked with resolving an IE8 page rendering issue in a legacy webapp (without changing much server-side code). I wrapped the largest sections of the page in textarea elements (on the server-side) and used JavaScript to extract their contents, remove the textareas and insert the html where the textarea was... it worked out nicely... it even seems to load faster in modern browsers.
If people use IE and it always does that, they've gotten used to this 'unresponsive' idea, whenever I zap open IE to check for compatibility, I just accept the fact that all pages look 'unresponsive' for a while.
It's part of IE, people that live in ignorance are used to that, they won't click away.
Not as much a solution to your problem, which is probably not there as telling you it's not that much of a problem. I don't think there is a way to give a browser instructions to adjust its rendering model for you though, and there shouldn't be, users should be able to adjust rendering models though, but not sites. Those things are a gateway to virus.

aspx page with gridview runs very fast in IE but 20% of the speed on Firefox

I have a simple aspx page with some search options which queries an SQLEXpress database, and it is displayed in a gridview.
For some reason, it runs lightning fast in IE but very slow in Firefox.
It has very little code, a gridview a couple of images and a couple of textboxes and a search button. It was done with Expression Web so no additional code added.
In production (not local) the speed is very noticiable when doing a search...
IE displays the results almost instantly...Firefox might take 3-5 seconds.
And everything else runs super fast as well in IE (update, delete etc).
Is there a reason for this ? Thanks
what kind of extensions do you have in firefox? something like fasterfox may be sending multiple page requests
Maybe the problem is with your Firefox Instance, maybe some creepy Add-Ons you installed or maybe you should disable Firebug which causes problems like this.

Resources