[
https://issues.apache.org/jira/browse/TAP5-1470?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13003886#comment-13003886
]
Michael Wyraz commented on TAP5-1470:
-------------------------------------
In the case where the problem occured it's a very modular application where
most components or modules bring their own css. E.g. a tree component brings
script and css for the tree, a buttonbar brings it's css and so on. That plays
good together with tapestry's component model but has the disadvantage that it
shows another internet explorer bug...
If you implement css aggrregation, keep the limits in mind:
http://joshua.perina.com/africa/gambia/fajara/post/internet-explorer-css-file-size-limit
Also, if you aggregate css, you have to do it in a way that media type is
supported in all browsers without changing the css file order. So basically the
same simple algorithm shown above has to be used for css aggregation (aggregate
all css together until either the media type changes or the css size limit is
reached). So you will still result in multiple css and you have to deal with
the problem above again.
> Group CSS together to avoid IE's restriction of 31 external css files
> ---------------------------------------------------------------------
>
> Key: TAP5-1470
> URL: https://issues.apache.org/jira/browse/TAP5-1470
> Project: Tapestry 5
> Issue Type: Improvement
> Components: tapestry-core
> Affects Versions: 5.2, 5.1
> Reporter: Michael Wyraz
>
> IE is restricted to load 31 external CSS per page. All other are ignored.
> Also the number of @import declarations are restricted to 30 per css
> declaration.
> The following change to DocumentLinkerImpl beraks the imported css into
> blocks. A new block starts when more than 30 @import occured of when the
> "media" attribute changes.
> protected void addStylesheetsToHead(Element root,
> List<IncludedStylesheet> stylesheets)
> {
> int count = stylesheets.size();
> if (count == 0) return;
> // This only applies when the document is an HTML document. This may
> need to change in the
> // future, perhaps configurable, to allow for html and xhtml and
> perhaps others. Does SVG
> // use stylesheets?
> String rootElementName = root.getName();
> // Not an html document, don't add anything.
> if (!rootElementName.equals("html")) return;
> Element head = findOrCreateElement(root, "head", true);
> Element existing = findExistingElement(head, "link");
> // Create a temporary container element.
> Element tempContainer = head.element("temp-container");
> for (int i = 0; i < count; i++)
> stylesheets.get(i).add(tempContainer);
> tempContainer.remove();
>
> Element container = head.element("css-container");
> // Fix für IE: Immer wenn der "media" Typ wechselt oder 30 CSS
> erreicht sind, wird ein neues CSS-Tag aufgemacht
> Element style=null;
> int cssCount=Integer.MAX_VALUE;
> String lastMedia="all";
>
> for (Node _css: tempContainer.getChildren())
> {
> if (!(_css instanceof Element)) continue;
> Element css=(Element) _css;
> String href=css.getAttribute("href");
> String media=css.getAttribute("media");
> if (media==null) media="all";
>
> if (cssCount>30 || !media.equalsIgnoreCase(lastMedia))
> {
> style=container.element("style", "type","text/css",
> "media",media);
> lastMedia=media;
> cssCount=0;
> }
> style.text("@import url("+href+");");
> cssCount++;
> }
> if (existing != null)
> container.moveBefore(existing);
> container.pop();
> }
--
This message is automatically generated by JIRA.
For more information on JIRA, see: http://www.atlassian.com/software/jira
