RE: [cssom] Constructable Stylesheets

Hi,

FWIW, I just had a closer look at the specification and -- despite my initial interest -- I'm not sure I still really like it.

I would argue that a problem which is even more important than memory usage to authors is debugging. Something I do like about expressing things in the DOM is that it's easy to find out when/where things are done as it's a reflective+observable API with amazingly good dev tools; right now nearly all style changes must happen in the DOM in some way and trigger events you can hook. This is not the case for your proposed API. 

Let's imagine we now can create stylesheets and have them not exposed the usual way. From a debugging perspective, I'm afraid it would be hard to find out why some style apply to an element, and where it comes from. Those rules would be hard to find manually, and the order in which they apply would be opaque.

That being said, I do understand the memory usage concern. Couldn't the problem be solved by allowing <style scoped src="{{some-blob-url}}" /> and share that blob? A <style> element isn't that much memory wasted, but it would allow to retain the spirit of the html usual style guide and (I think) make the page much easier to debug for a vast majority of developers.

What do other people think? Am I alone thinking that way?
François



> To: jackalmage@gmail.com; jonathan@jooped.co.uk
> CC: www-style@w3.org
> Date: Mon, 23 Mar 2015 08:43:48 +0100
> From: simonp@opera.com
> Subject: Re: [cssom] Constructable Stylesheets
> 
> On Sun, 22 Mar 2015 23:55:02 +0100, Jonathan Kingston  
> <jonathan@jooped.co.uk> wrote:
> 
> > I didn't really make my mail clear before, the spec mentions the key
> > 'moreStyleSheets' will this be a named key of document.styleSheets, an
> > indexed key or a totally separate top level key?
> >
> > document.styleSheets = styleSheets{
> > 1:{}, 2: {}, 3: moreStyleSheets{}};
> >
> > document.styleSheets = styleSheets{
> > 1:{}, 2: {}, moreStyleSheets: moreStyleSheets{}};
> >
> > document.moreStyleSheets = moreStyleSheets{}};
> 
> It's document.moreStyleSheets. The IDL is:
> 
> interface TreeScope {
>    attribute StyleSheetList moreStyleSheets;
> };
> Document implements TreeScope;
> ShadowRoot implements TreeScope;
> 
> -- 
> Simon Pieters
> Opera Software
>