Comment charger un CSS de manière asynchrone sans l'aide de JavaScript?
Suppose que si j'ai un site web http://somethingsomething.com
Et j'ai 3 fichier css
- commun.css
- page d'accueil.css
- intérieure-pages.css
homepage.css
est requis pour la page d'accueil et common.css
est pour tout le site, mais inner-pages.css
est pour les autres pages seulement et c'est gros fichier. Est-il possible de charger inner-pages.css
après la page d'accueil de téléchargement de données. De la même manière que nous utilisons async
attribut pour script
tag. Autant que je sache async
attribut est uniquement pour JS pas de CSS
mon ami m'a suggéré d'utiliser requirejs pour cette http://requirejs.org/docs/faq-advanced.html#css mais je ne veux pas utiliser javascript pour charger les css et même je pense que lors de la JS je ne l'utilise pas require.js juste pour cela. Donc, si il n'est pas possible avec CSS. quel serait le simple JS façon de le faire?
Oui, ce que vous avez dit, je le sais déjà. voulais juste vérifier si quelqu'un a une opinion différente ou un truc.
Comme David Nguyen dit, si vous rapetisser et de mettre tous les css dans un seul fichier, le premier chargement sera mauvais, mais la prochaine charges seront dans le cache, de sorte qu'il sera rapide. Mais de toute façon, je suis curieux de savoir si ses possible sans javascript...
En fait, je vous devriez être en mesure de charger asynchrone à l'aide d'un iframe...réponse ci-dessous
pourrait ceci être d'intérêt pour la discussion?
OriginalL'auteur Jitendra Vyas | 2013-11-06
Vous devez vous connecter pour publier un commentaire.
Async CSS avec media="bidon" et un
<link>
au piedDire que nous avons eu notre HTML structuré comme ceci:
Plus à http://codepen.io/Tigt/post/async-css-without-javascript
OriginalL'auteur Abhishek Gupta
essayer
ou
ok désolé je n'avais pas voir vous ne voulez pas utiliser de javascript
comment sur l'utilisation de css @import:
est même pire que <lien>: stackoverflow.com/questions/7199364/import-vs-link
OriginalL'auteur
Vous pouvez placer une iframe dans votre page de pointage pour certains mannequin page qui sert le CSS, qui doit servir le fichier CSS async.
<iframe src="loadcss.html"></iframe>
Ne remarque il semble assez trivial, ce qui provoque un minimum de 2 css transferts de fichiers par page et css 3 transferts de fichier par page enfant (si elle n'est pas mise en cache). Si vous étiez à rapetisser le css, vous n'avez 1 transfert indépendamment.
OriginalL'auteur David Nguyen
Inclure votre code CSS dans la
<body>
au lieu de<head>
... "il semble que ce truc causes Chrome & Firefox pour démarrer le corps plus tôt, et ils n'ont tout simplement pas de bloc pour le corps les feuilles de style." et d'ajouter une condition pour IE:tête
corps
par Taylor Chasse @codepen.io
OriginalL'auteur Yatko