Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Shadow]: Add support for external stylesheets using link rel="stylesheet" (bugzilla: 22539) #82

Closed
hayatoito opened this issue May 25, 2015 · 1 comment

Comments

@hayatoito
Copy link
Contributor

Title: [Shadow]: Add support for external stylesheets using link rel="stylesheet" (bugzilla: 22539)

Migrated from: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539


comment: 0
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c0
Steve Orvell wrote on 2013-07-02 16:19:39 +0000.

It is, of course, possible to use external stylesheets within a <style> element via @import-(migrated-from-bugzilla-to-avoid-pinnging-users-in-github). The spec should consider adding support also for including stylesheets via link rel="stylesheet" because:

  1. it's simpler
  2. it's familiar
  3. to avoid possible negative characteristics of @import-(migrated-from-bugzilla-to-avoid-pinnging-users-in-github): https://developers.google.com/speed/docs/best-practices/rtt#AvoidCssImport

comment: 1
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c1
Steve Orvell wrote on 2013-07-02 16:23:46 +0000.

We should be able to dimiss point #3 since we're comparing link rel="stylesheet" to:

<style> @import-(migrated-from-bugzilla-to-avoid-pinnging-users-in-github) url(sheet.css); </style>

comment: 2
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c2
Dimitri Glazkov wrote on 2013-07-17 16:48:48 +0000.

*** Bug 19276 has been marked as a duplicate of this bug. ***


comment: 3
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c3
Hayato Ito wrote on 2014-05-29 08:46:11 +0000.

Hi Steve, is this feature request still valid?

I think this feature request makes sense. Looks reasonable to me.


comment: 4
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c4
Dimitri Glazkov wrote on 2014-05-29 16:02:15 +0000.

Just as an idea: can we look at how this would desugar into an imperative API?

Elliott had this notion of:

var stylesheet = new CSSStyleSheet(url);
root.stylesheets.add(stylesheet).

Is this basically it?


comment: 5
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c5
Steve Orvell wrote on 2014-05-29 16:37:41 +0000.

I agree with Dimitri and he has a good basic summary.

We need to resolve the fetching issues with using remote stylesheets in shadowRoots before adding any new behavior, and the imperative api Dimitri outlined should address this.

The basic problem is that if a style element that has remote content (@import-(migrated-from-bugzilla-to-avoid-pinnging-users-in-github)) is added to a shadowRoot, the remote content is fetched. Imagine that an author wants to create N shadowRoots. The author uses the best practice of putting style elements inside shadowRoot but wants to use a remote stylesheet in each one. This currently requires N network requests, even if there is only 1 referenced remote stylesheet.

The idea behind root.stylesheets.add(stylesheet) is that you can apply a stylesheet to a shadowRoot without causing it to re-fetch or parse.


comment: 6
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=22539#c6
Hayato Ito wrote on 2014-05-30 05:02:10 +0000.

Thank you. That looks very reasonable argument and looks very important from the view of the performance. Totally agreed.

(In reply to Steve Orvell from comment #5)

I agree with Dimitri and he has a good basic summary.

We need to resolve the fetching issues with using remote stylesheets in
shadowRoots before adding any new behavior, and the imperative api Dimitri
outlined should address this.

The basic problem is that if a style element that has remote content
(@import-(migrated-from-bugzilla-to-avoid-pinnging-users-in-github)) is added to a shadowRoot, the remote content is fetched. Imagine
that an author wants to create N shadowRoots. The author uses the best
practice of putting style elements inside shadowRoot but wants to use a
remote stylesheet in each one. This currently requires N network requests,
even if there is only 1 referenced remote stylesheet.

The idea behind root.stylesheets.add(stylesheet) is that you can apply a
stylesheet to a shadowRoot without causing it to re-fetch or parse.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants