Preload CSS/JavaScript without execution

April 21st, 2010. Tagged: CSS, images, JavaScript, performance

Preloading components in advance is good for performance. There are several ways to do it. But even the cleanest solution (open up an iframe and go crazy there) comes at a price - the price of the iframe and the price of parsing and executing the preloaded CSS and JavaScript. There's also a relatively high risk of potential JavaScript errors if the script you preload assumes it's loaded in a page different than the one that preloads.

After a bit of trial and lot of error I think I came up with something that could work cross-browser:

  • in IE use new Image().src to preload all component types
  • in all other browsers use a dynamic <object> tag

Code and demo

Here's the final solution, below are some details.

In this example I assume the page prefetches after onload some components that will be needed by the next page. The components are a CSS, a JS and a PNG (sprite).

window.onload = function () {
 
    var i = 0,
        max = 0,
        o = null,
 
        // list of stuff to preload
        preload = [
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.png',
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.js',
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.css'
        ],
        isIE = navigator.appName.indexOf('Microsoft') === 0;
 
    for (i = 0, max = preload.length; i < max; i += 1) {
        
        if (isIE) {
            new Image().src = preload[i];
            continue;
        }
        o = document.createElement('object');
        o.data = preload[i];
        
        // IE stuff, otherwise 0x0 is OK
        //o.width = 1;
        //o.height = 1;
        //o.style.visibility = "hidden";
        //o.type = "text/plain"; // IE 
        o.width  = 0;
        o.height = 0;
        
        
        // only FF appends to the head
        // all others require body
        document.body.appendChild(o);
    }
    
};

A demo is here:
http://phpied.com/files/object-prefetch/page1.php?id=1
In the demo the components are delayed with 1 second each and sent with Expries header. Feel free to increment the ID for a new test with uncached components.

Tested in FF3.6, O10, Safari 4, Chrome 5, IE 6,7,8.

Comments

  • new Image().src doesn't do the job in FF because it has a separate cache for images. Didn't seem to work in Safari either where CSS and JS were requested on the second page where they sould've been cached
  • the dynamic object element has to be outside the head in most browsers in order to fire off the downloads
  • dynamic object works also in IE7,8 with a few tweaks (commented out in the code above) but not in IE6. In a separate tests I've also found the object element to be expensive in IE in general.

That's about it. Below are some unsuccessful attempts I tried which failed for various reasons in different browsers.

Other unsuccessful attempts

1.
I was actually inspired by this post by Ben Cherry where he loads CSS and JS in a print stylesheet. Clever hack, unfortunately didn't work in Chrome which caches the JS but doesn't execute it on the next page.

2.
One of the comments on Ben's post suggested (Philip and Dejan said the same) using invalid type attribute to prevent execution, e.g. text/cache.

var s = document.createElement('script');
s.src = preload[1];
s.type = "text/cache";
document.getElementsByTagName('head')[0].appendChild(s);

That worked for the most parts but not in FF3.6 where the JavaScript was never requested.

3.
A dynamic link prefetch didn't do anything, not even in FF which is probably the only browser that supports this.

for (i = 0, max = preload.length; i < max; i += 1) {
    var link = document.createElement('link');
    link.href = preload[i];
    link.rel = "prefetch";
    document.getElementsByTagName('head')[0].appendChild(link);
}

Then it took a bit of trial/error to make IE7,8 work with an object tag, before I stumbled into IE6 and gave up in favor of image src.

In conclusion

I believe this is a solution I could be comfortable with, although it involves user agent sniffing. It certainly looks less hacky than loading JS as CSS anyways. And object elements are meant to load any type of component so no semantic conflict here I don't believe. Feel free to test and report any edge cases or browser/OS combos. (JS errors in IE on the second page are ok, because I'm using console.log in the preloaded javascript)

Thanks for reading!

Tell your friends about this post: Facebook, Twitter, Google+

109 Responses

  1. Have you tried exchanging one with the other? So, load javascript as stylesheet and stylesheet as javascript? Wouldn’t be surprised if that was a cheap alternative. If you can stand the reported errors, that is. Haven’t tested this, just a thought.

  2. Well, JS as print stylesheet is where I started from, didn’t work properly in Chrome.

    CSS as JS will be a syntax error most likely.

  3. Awesome! I’ve been meaning to follow up on my original research and come up with a solid solution, but this looks like just that :)

    qFox – Yeah, CSS as JS will through a syntax error, and JS as CSS is dangerous in Chrome (actually, both are). Chrome forces sanity onto the type when it goes into the cache, so even though your JS is loaded as a stylesheet, Chrome ignores the “(application|text)/javascript” type and gives it “text/css” instead. Then, on future pages, requests for this file will be served from cache with “text/css”, and Chrome will refuse to execute anything with that type as JavaScript.

  4. This would make a great YUI 3 Gallery module. Using this plus something like Nicholas’s Idle Timer to preload resources for yet-to-be-displayed pages or dynamic content sections would be a great fit.

  5. Great post! This approach seems to be working under all browsers which is strange :) and awesome!

  6. Great research, are you using this in production mode?

  7. The downside of this technique is that the Object tags add “spacing” at the bottom of your page.

  8. The “text/cache” invalid mime-type on a script tag does not work in FF or Opera, but *does* work in IE, Chrome, Safari, and others. By that, I mean, the element *does* get fetched into cache for later use (on same page or subsequent pages).

    And contrary to some observations above, in Chrome, the script pulled in this way is not tagged with an invalid type that prevents it from being used from cache as a valid script — subsequently adding a regular script tag with a valid mime-type on it causes the script to be pulled from cache and executed immediately. This is the trick that LABjs currently uses for those browsers, and thus far the testing proves it to be reliable.

    I’m interested in the “object” trick, that’s interesting, and may be a valid approach for CSS preloading. I wonder if the “onload” works reliably. I have the Image.src approach, seems so much more hacky than other tricks. But I can see that it might be a valid solution. Again, is onload reliable?

  9. Kyle – You’re correct, the “text/cache” script doesn’t cause the invalid type in Chrome, it’s loading a script in a link tag with rel=”stylesheet” that does (my original attempt).

  10. Jason Persampieri

    Just for grins, how horrible is it to load the file as a string, then append it to a new script tag or eval it when ready?

  11. A better IE detection function: http://gist.github.com/358029

  12. I ran your test page through IE7 on Vista (empty cache) twice, and got this:
    - first page: 3 files load as expected
    - second page: the JS and CSS file are downloaded again (200 response), but not the PNG

    How’s that for weirdness?

  13. Awesome research. Thanks, Stoyan!

    I took the liberty of optimizing the for loop into a more efficient reverse while loop and rewriting your code as a function that takes an array of files as argument. See gist 375496.

    Example:

    preload([
    'http://tools.w3clubs.com/pagr2/1.sleep.expires.png',
    'http://tools.w3clubs.com/pagr2/1.sleep.expires.js',
    'http://tools.w3clubs.com/pagr2/1.sleep.expires.css'
    ]);

  14. Nice. Been waiting for this post for a long time man. Good to see it done.

  15. Normal people use else instead of continue ;)

  16. This is awesome. I was just searching for a solution to the preloading thing and couldn’t find anything so started making my own. Naturally this comes along right after I finished mine and is much more elegant.

    Great job!

  17. So I just tried replacing my solution with yours and found a detail that may be helpful to others. I am wanting to have an optional loading indicator so I can have my loading script run silently on a login screen, but then have a dedicated loading page (like gmail)… both using the same script.

    In trying to use your object method I found that the load event doesn’t work on OBJECT elements like it does on IMG and IFRAME elements (which I was using before). So I am not able to know when the files are actually done loading to update the progress bar and to redirect off of the loading screen.

    Just a little tidbit for others if they are wanting to do likewise, and a call for help if anyone has any suggestions.

  18. @Aaron, I tried IE8 in IE7 mode on Vista and it all worked fine… In my experience so far IE8-in-IE7-mode/Vista mode behaves just like real IE7/Vista. But this could be an exception.

  19. So in order to use this, do I need to rename my .js and .css to the above or can I just
    preload = [
    'http://url .com/style.css',
    'http://url .com/jquery-plugins-adds.min.js',
    ],

  20. Serj, what you suggest should work

  21. Why shouldnt we just use xmlhttprequest to prefetch ?

  22. @John, sure, but there’s the same domain restriction

  23. How about preloading other objects, like font files (.eot, .ttf)?

    Hmm … as I type this I’m thinking: why ask you to do the testing and not simply do it myself? Yes, I will. Will post results here.

  24. OK, I created a test page for preloading font files: .eot, .ttf, .svg, .woff.
    It does not work, except for in IE and Opera 10.

    Results:
    - Chrome: FAIL. Chrome shows the yellow bar at top of the page asking if I want to download files + immediately a ‘Save file’ window appears for the .eot file (first in the array).
    - IE7 and IE8: PASS. All 4 files are download after onload and no feedback to the user.
    - FF3.0: FAIL: the 4 files are downloaded but the yellow bar appears at top of page with the message “Additional plugins are required to display all the media on the page”.
    - Opera 10.61: PASS. All 4 files are download after onload and no feedback to the user.

    The test page is here: http://www.aaronpeters.nl/sandbox/wpo/preload-font-files.html

    Stoyan, any thoughts on why it fails in Chrome and FF and a solution?

    Use case: blog uses @font-face with a cool font: preload the font files when user visits the non-blog webpages.

  25. Follow up on the preloading of font files…

    I did some more testing.
    As it turns out, using our code to preload the .svg file works fine in all browsers, and fails in Chrome/FF for the other 3 files. The difference is in the mime type and gzip on/off, but I’m not sure this has anything to do with it.
    .eot = text/font, gzip on
    .ttf = text/font, gzip on
    .woff = text/plain, gzip off
    .svg = image/svg+xml, gzip on

    Next, I tested preloading the 3 failing font files with new Image().src in *all* browsers (not just in IE). Guess what? It works in *all* browsers: files are downloaded, user gets no feedback on the downloading, no warnings, errors or yellow bars.

    Of course, you really don’t want to preload all 4 files for all browsers since browsers don’t support all font files (and really only need 1):

    .eot for IE4+
    .ttf for Firefox 3.5+ , Opera 10+, Safari 3.1+, Chrome 4.0.249.4+
    .svg for iPad and iPhone
    .woff for Firefox 3.6+, Internet Explorer 9+, Chrome 5+

    Source: http://www.fontsquirrel.com/fontface

    Stoyan, can you ‘upgrade’ your code with some nifty browser detection to enable preloading the right font file(s) in the right browser? I hope so ;-)

  26. Final comments about preloading font files (nutshell: no go in IE and FF)

    1) Je suis un dumbass. In the previous comments you can read I tested with Firefox 3.0 which makes no sense at all since that browser does not support @font-face :(
    New tests were done with FF 3.5.4

    2) The preloading does NOT work on IE7, IE8 and FF3.5.4 (yes, conclusions earlier were wrong).
    IE and FF actually download the font files without any issues (test page: http://www.aaronpeters.nl/sandbox/wpo/preload-font-files-3.html) but the font file is not used from cache on the next page (
    http://www.aaronpeters.nl/sandbox/wpo/preload-font-files-validate.html). The browser does an unconditional request and downloads the file from server.

    Chrome5 and Opera10.6 are sweet as they do what I want: preload nicely and use font file from cache.
    But since these browsers are the fast ones, the benefit is small and not worth the hassle.

    Behavior on iPhone/iPad: don’t know, didn’t test it.

    Sorry Stoyan and readers, next time I’ll try not to make mistakes and not post 4 comments but only 1 or 2…

  27. Hi,

    I tried this for preloading a swf file (which may be needed for next page in the flow) on firefox with clean cache.

    I think since this is an object tag, the flash is being executed.

    the flash file tries to load some ‘config.xml’ thingie in the wrong manner.

    Is there a better way to preload .swf files?

    -Sajal

  28. Very interesting work. I wonder if you might be better off using conditional compilation for the IE-specific stuff? That’s got to be better than checking the user agent string, right?

  29. [...] technique uses iframes so requires changing your existing scripts. Stoyan has gone on to explore using image and object tags to download scripts without the browser executing them, and then doing the parse-execute when the code is [...]

  30. Preload von JS ohne es auszuführen…

    Preload CSS/JavaScript without execution Preloading components in advance is good for performance. There are several ways to do it. But even the cleanest solution (open up an iframe and go crazy there) comes at a price – the price of the iframe and the…

  31. [...] 参考:http://www.phpied.com/preload-cssjavascript-without-execution/ headjs 源码 2010 12 14 Javascript Comments(0) « 得到某月有多少天 [...]

  32. Really interesting stuff you have here. It kept me reading. I understand the IE idea better now.

  33. [...] Stefanov, a former teammate and awesome performance wrangler, recently blogged about preloading JavaScript without execution. His approach is to download the script as either an IMAGE or an OBJECT element (depending on the [...]

  34. HI Stoyan
    why not use iframe instead of object? In some test I made , the two element looks exact the same thing. Thank you~

  35. [...] control over how and when JavaScript files are loaded and executed on a page. It does so by using Stoyan Stefanov’s approach of preloading JavaScript without executing it and has the pleasant side effect of enabling parallel [...]

  36. YUI 3 module in Gallery using this technique. http://yuilibrary.com/gallery/show/preload

  37. [...] technique uses iframes so requires changing your existing scripts. Stoyan has gone on to explore using image and object tags to download scripts without the browser executing them, and then doing the parse-execute when the code is [...]

  38. [...] Stefanov explains how to preload CSS and JavaScript without executing it – and no, he doesn’t use [...]

  39. [...] Stefanov describes a better workaround on his blog. He advocates including some client-side Javascript that’ll include the resources in a [...]

  40. I think that your solution is a great approach most of the time, but fails in some cases. I extended your test a bit at http://blog.redfin.com/devblog/files/2011/03/page_one_a.html, and wrote up a possible alternative at http://blog.redfin.com/devblog/2011/03/prefetching_web_content_trials_and_tribulations.html

  41. [...] 此发现引导我提出了将JavaScript拆分的建议:一部分初始加载页面用于渲染页面的代码;另一部分是可以稍后加载的用于DHTML和Ajax的代码(参见此文或是《高性能网站建设进阶指南》的第三章)。网站通常在window的onload事件处理函数中下载页面稍后需要的代码。Gmail Mobile team 发现 当后续代码到达浏览器时UI会被锁住,这是不恰当的。总之,这些用于DHTML/Ajax的代码甚至很可能不会被用到。他们是我发现的第一批找到方法脚本 分离下载阶段和脚本加载的解析-执行阶段的家伙们。他们使用的方法是对所有代码加上注释,然后当需要时再移除注释分隔符并且执行它们。GMail的技术使 用了iframe,所以需要改变你现存的代码。Stoyan已经开始探索使用image和object标签加载脚本以避免执行他们,只有到需要执行时再进行专门的解析和执行。 [...]

  42. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  43. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  44. [...] סטפנוב מציע להשתמש בתג object ולטעון לתוכו את הכתובות. בשביל אקספלורר אפשר פשוט לכתוב new Image().src=url, גם עבור קבצי סגנון [...]

  45. FWIW, this script seems to work in IE9 as well.

  46. [...] 2009, Google’s article* http://www.phpied.com/preload-cssjavascript-without-execution/ © 2011 Unknown [...]

  47. [...] For the current page is not the link, if need to download the following content can use js to achieve, please refer to this articlePreload CSS/JavaScript without execution [...]

  48. You can cache swf files on at least IE and Chrome using the following:

    The “declare” attribute tells the browser to download but not execute it, and the classid (the clsid for shockwave flash) convinced IE that it was worth downloading without doing a HEAD request to determine the file type.
    I didn’t get this to work on Firefox 5, but I only tried it cross-domain… it would probably work in-domain.

  49. Hmm, it stripped my html. Lemme try escaping it
    <object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ data=”http://cityvillefb.static.zgncdn.com/hashed/e22be2ab73010dd6afde5c39a37834ce.swf” declare=”1″></object>

  50. [...] 書き込みの下の参そっちの一部を与えていたことがいくつもの関連議論のリンク*http://googlecode.blogspot.com/2009/09/gmail-for-mobile-html5-series-reducing.htmlだった09年のグーグルの文章が掲載された*http://www.phpied.com/preload-cssjavascript-without-execution/だった [...]

  51. VPS…

    Preload CSS/JavaScript without execution / Stoyan’s phpied.com…

  52. [...] Stoyan Stefanov wrote a great post with tactical information on pre-fetching. Here is his post: http://www.phpied.com/preload-cssjavascript-without-execution/ This entry was posted in Technical. Bookmark the permalink. blog comments powered by [...]

  53. [...] – 使用preload技术,除了loader外 [...]

  54. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  55. oxyhives prescription…

    [...]Preload CSS/JavaScript without execution / Stoyan’s phpied.com[...]…

  56. [...] Preload CSS/JavaScript without execution – Pré-chargement des CSS et du Javascript sans exécution. [...]

  57. [...] Preload CSS/JavaScript without execution – Pré-chargement des CSS et du Javascript sans exécution. [...]

  58. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  59. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  60. I tried follow code,tested in ie8 chrome16 and ff8,ie and chrome do cache the javasctipt,bu i have no idea wether firefox do so for firebug don’t report wether the new js is from cache.
    var names=[]//js to be loaded
    var loadCount=0;
    var loadCountl=names.length;
    var img=new Image();//使用改变img对象src的方式加载所需js一次,放入缓存
    img.onerror = function (a) {//当img加载完成后会触发onerror事件(不会触发onload,可能是由于mime类型不对)
    if(loadCount0){//开始加载
    loadJs(names[loadCount++])
    }
    function loadJs(packageName){//预加载js,使用了kola加载器的内部函数
    var src=kola.Package._path(packageName);
    img.src=src;
    }

  61. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  62. I wonder if the “onload” works reliably.And does it load in Chrome?

  63. Hi, Neat post. There’s a problem together with your site in web explorer, may test this? IE nonetheless is the market leader and a big portion of other people will omit your excellent writing due to this problem.

  64. I found by way of the YUI Gallery Preload module that the dynamic object tag approach appears to block user interaction in some browsers:

    http://yuilibrary.com/forum/viewtopic.php?f=197&t=10198

    I also came across this post documenting further research into JavaScript preloading:

    http://static.jtwb.dotcloud.com/research/preloaders.html

  65. Michael Smedberg

    FWIW, at Redfin we’ve been using the ” for CSS” approach, and David Kilzer with Webkit suggested that it’s suboptimal. Here’s part of David’s admonition:

    Unfortunately, when CSS resources are loaded this way, it causes them to be laid out in a single column that’s
    one character wide, and because the object tag is visible on the web page (and despite it’s width of zero and
    height of zero), WebKit is forced to construct a render tree and layout all of the text. That results in over 300,000
    lines of text (each one character wide) being constructed for this web page!
    This consumes a lot of memory in all browsers, but is especially noticeable on mobile browsers like Safari on
    iOS on iPad. In fact, it sometimes causes Safari on iOS to crash while loading this web page due to the extra
    memory use.

  66. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  67. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  68. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  69. friv.blog.terra.com.co

    Hello there! I could have sworn I’ve been to this web site before but after looking at a few of the posts I realized it’s new to me.
    Regardless, I’m certainly happy I discovered it and I’ll be book-marking it and
    checking back often!

  70. [...] Preload CSS/JavaScript without execution – Pré-chargement des CSS et du Javascript sans exécution. [...]

  71. Прекрасно…

  72. Woah! I’m really digging the template/theme of this website. It’s simple, yet effective.
    A lot of times it’s tough to get that “perfect balance” between usability and appearance. I must say you’ve done a great job
    with this. In addition, the blog loads extremely fast for me
    on Firefox. Superb Blog!

  73. FYI the IE team discourages the prefetch approach as described here:

    http://blogs.msdn.com/b/ieinternals/archive/2012/05/05/problems-with-using-img-to-prefetch-script-or-css.aspx

  74. Everything is very open with a really clear clarification of the issues.
    It was truly informative. Your site is useful. Thank you for
    sharing!

  75. Scrum Training…

    “[...]Preload CSS/JavaScript without execution by Patrice Neff – Memonic[...]“…

  76. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  77. These are truly impressive ideas in regarding blogging.
    You have touched some nice points here. Any way keep up wrinting.

  78. Howdy! I could have sworn I’ve been to this blog before but after reading through some of the post I realized it’s new to me.
    Anyways, I’m definitely glad I found it and I’ll be book-marking and checking
    back frequently!

  79. Unlike most removable drives, a USB drive does not require rebooting after it’s attached, does not require batteries or an external power supply, and is not platform dependent. I lost a lot of performance on the road in the cables, so you hardly comes up at top speed. To understand more fully what is going on here you need to step back and get into the basic design parameters of the technology behind the USB port.

    Also visit my blog … usb 8g

  80. obviously like your web site but you have to
    check the spelling on several of your posts. A number of them are rife
    with spelling issues and I find it very troublesome
    to inform the reality however I’ll definitely come back again.

  81. Hello there, I found your website by means of Google while searching for a comparable matter, your site came up, it looks great. I’ve bookmarked to favourites|added to bookmarks.

  82. Hi there, I discovered your website via Google
    even as looking for a related matter, your site came up, it looks
    great. I’ve bookmarked it in my google bookmarks.
    Hi there, just changed into aware of your weblog through Google, and located that it’s really informative.
    I’m gonna watch out for brussels. I will be grateful when you proceed this in future. Numerous folks can be benefited out of your writing. Cheers!

  83. [...] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution [...]

  84. naturally like your web-site but you have
    to take a look at the spelling on several of your posts.
    Several of them are rife with spelling issues and I find it very bothersome to tell the
    reality nevertheless I’ll definitely come again again.

  85. If you wish for to obtain a great deal from this piece of writing
    then you have to apply these strategies to your won website.

  86. Hello there, I believe your site could be having browser compatibility problems.

    Whenever I look at your web site in Safari, it looks fine however, when opening in IE, it’s got some overlapping issues. I merely wanted to provide you with a quick heads up! Apart from that, excellent website!

  87. I believe that is among the so much significant info for
    me. And i am satisfied reading your article.
    However want to statement on few basic issues, The website
    taste is ideal, the articles is actually great :
    D. Good job, cheers

  88. Howdy, i read your blog occasionally and i own a similar one and i was just wondering if you get a lot of spam feedback?
    If so how do you reduce it, any plugin or anything you can suggest?
    I get so much lately it’s driving me crazy so any help is very much appreciated.

  89. Thanks for sharing your info. I truly appreciate
    your efforts and I will be waiting for your next write ups thank
    you once again.

  90. Hi there, I discovered your blog by the use of Google while looking for a similar subject, your web
    site came up, it appears great. I have bookmarked it
    in my google bookmarks.
    Hi there, simply turned into alert to your weblog via
    Google, and located that it is truly informative. I’m gonna watch out for brussels. I will appreciate should you continue this in future. Lots of people shall be benefited from your writing. Cheers!

  91. Wow! Thank you!!! I constantly wanted to write on my website something like that. Can I include a portion of your post to my website? North Platte Roofing Pro, 3765 E. Cavalry Hills Dr., North Platte, NE, 69101, US, 308-221-8734

  92. It’s an awesome article in favor of all the web people; they will take benefit from it I am sure.

  93. I don’t even know the way I finished up right here, however I thought this submit was once good. I do not recognise who you’re however
    definitely you are going to a well-known blogger if you
    happen to aren’t already. Cheers!

  94. [...] 《Preload CSS/JavaScript without execution》 [...]

  95. […] esto, que puede ser un poco complejo, podemos usar un código que he encontradoy que parece funcionar correctamente en todos los […]

  96. Usually consumers that buy the eye cream reviews before use; for
    easily getting rid of the dark circles. These vessels are
    most evident when an individual has slikm skin around the eyes becomes increasingly thin, however, in the
    other a diamond tipped wanhd dark circles is used to remove the
    darkness from under your eyes. Many suffer from dark
    circles under tthe eyes can also be purchased onlikne
    through Amazon.

  97. Hey Stoyan,
    I don’t understand why you do ‘o.width=0;o.height=0;’ and you wrote in the comment that it’s only for IE. If you’re in IE, you shouldn’t be reaching this code since you’re implicitly checking for ‘Microsoft’ in ‘navigator.appName’ before that.
    Can you please explain ?…

  98. Nice post. I learn something totally new and challenging on websites I stumbleupon everyday.
    It’s always useful to read through articles from other writers and practice something from other sites.

  99. Youu are so interesting! I don’t suppose I’ve rrad a single thing like that before.
    So nice to fin another person with some original thoughts
    on this subject. Seriously.. thanks for starting this up.
    This site is something that’s needed on the
    internet, someone with some originality!

  100. hello!,I love your writing very a lot! percentage
    we keep in touch extra about your post on AOL?
    I require an expert on this house to unravel my problem.
    Maybe that’s you! Having a look ahead to peer you.

  101. […] 对于不在当前页面中的链接,如果需要预下载后续内容可以用JS来实现,请参考这篇文章Preload CSS/JavaScript without execution。 […]

  102. If you are in construction you realize that there exists a large amount of recourses which might be complete junk, thankfully your website is just not one of those websites, i really like your content a lot, keep up the great job

  103. […] 对于不在当前页面中的链接,如果需要预下载后续内容可以用js来实现,请参考这篇文章Preload CSS/JavaScript without execution […]

  104. […] 今天在Stoyan Stefanov的博客中(原文:Preload CSS/JavaScript without execution)找到了兼容所有主流浏览器的预加载css、js和图片的方法。代码中还隐藏着之前不知道小技巧,我喜欢这种猫腻。闲言少叙,下面是原文示例中的代码,翻译了部分注释。 […]

  105. I was just looking for this info for some time. After 6 hours of continuous Googleing, finally I got it in your web site. I wonder what is the Google’s issue that does not rank this type of informative web sites closer to the top. Usually the top web sites are full of garbage.

  106. Hello, I think your site might be having browser compatibility
    issues. Whhen I look at your blig inn Ie, iit looks fine but when openning in Internet Explorer, it has some overlapping.
    I just wante to ive you a quick heads up! Other then that,
    gret blog!

  107. […] <object> prefetch: http://www.phpied.com/preload-cssjavascript-without-execution/ […]

  108. There’s certainly a lot to know about this topic.
    I really like all of the points you have made.

  109. whoah this blog is fantastic i really like reading your articles.
    Keep up the great work! You understand, a lot of people are looking
    around for this information, you could help them greatly.

Leave a Reply