Les composants JS sont généralement livrés avec une image CSS, mais il peut être un peu gênant de l'utiliser de cette façon. Afin de rendre le composant suffisamment solo, j'ai eu l'idée d'emballer l'image CSS dans js, puis. réduire le nombre de demandes d'ailleurs. Cela semble être plus important, hehe.
Alors, comment packager ? Bien qu'il existe des solutions telles que Resource-Packages , nos principaux utilisateurs utilisent toujours des navigateurs à la mode comme ie6 !
Ma solution :
- CSS : CSS peut être stocké dans js sous forme de chaîne et ajouté dynamiquement à la page par js. La page peut ne pas être adaptée à l'utilisation, mais le composant ne sera généralement pas affecté.
- image : Les images utilisées en CSS sont compilées en js en utilisant dataURI ( RFC 2397 ) et MHTML ( RFC 2557 ). ( dataURI et MHTML écrits par Qin Ge sont toujours recommandés aux étudiants qui ne savent pas ce qu'ils sont). Si vous souhaitez un chemin absolu en CSS, vous pouvez également enregistrer js. Si js est directement utilisé, c'est théoriquement possible, mais il est généralement préférable de simplement changer le nom de classe de js.
- flash : Certains flashs relativement petits, tels que le stockage, la copie, etc., peuvent également être empaquetés. Cependant, nous pouvons maintenant résoudre le problème des non-IE. Pour les non-IE, utilisez des liens externes.
Voici un exemple de test d'emballage .
Quelques détails et enchevêtrements
- Il n'est pas nécessairement raisonnable de regrouper toutes les images dans js. Ce qui est empaqueté doit être les images qui doivent être utilisées.
Alors, vaut-il mieux regrouper les images exclues dans un autre package ou utiliser les images directement ? - Les images peuvent d'abord être compressées, puis modifiées. L'outil de compression d'image que je choisis est pngout et j'utilise généralement
-s5
.
Quelqu'un a fait quelques tests. Données non compressées en base64. Probablement pas , chacun peut se faire son propre jugement. - Les références d'images répétées seront très volumineuses si vous utilisez dataURI directement, et gzip est aussi stupide qu'un cochon et ne le compressera pas.
J'ai choisi de l'enregistrer en tant que variable js, tandis que mes camarades de classe sur Taobao utilisent la méthode class. - MHTML ne peut pas être affiché dans ie7+/vista en raison du manque de délimiteur de fin. Win03sp2 n'a pas
Content-Type
et provoquera des invites de sécurité. La raison est que MIME n'est pas standard et que tout ne peut pas être omis. - Dois-je choisir de tout regrouper dans un seul fichier ou de le regrouper dans deux fichiers selon les types MHTML et dataURI et d'envoyer le fichier selon ua sur le serveur ou de le lire intelligemment par la bibliothèque de classes. Il semble que cette dernière soit plus harmonieuse ?
- Il y a un problème avec l'utilisation de dataURI pour compiler swf. On dit qu'il n'y a aucun problème avec fp8, mais maintenant c'est fp10.
Une autre solution solo consiste à regrouper js dans swf, mais cela semble disharmonieux.
exemple en plusieurs parties/connexe
Ce n’est pas standard mais cela peut fonctionner. Les sauts de ligne sont également très importants.
Type de contenu : multipart/connexe ;boundary="_BAIDU_YOUA_BB_YEP"
--_BAIDU_YOUA_BB_YEP
Type de contenu : image/png
Emplacement du contenu : logo.png
Encodage de transfert de contenu : base64
...base64...
--_BAIDU_YOUA_BB_YEP
Type de contenu : image/png
Emplacement du contenu : nono.png
Encodage de transfert de contenu : base64
...base64...
--_BAIDU_YOUA_BB_YEP--