It may be specific to nghttpx or http2 push...not sure. The author of nghttpx stated from https://github.com/tatsuhiro-t/nghttp2/issues/501#issuecomment-182903713
Currently, we only consider js and css to interleave them to the parent >> resource. It looks like polymer uses HTML files to do some styling. If >> pushing HTML is common usecase in plymer, then we'd like to consider to >> interleave HTML as well as js and css. > > >> This is not a cause of this issue, but it would be better not to set Link >> preload header to pushed resources. Possibly, consider to set them in main >> (landing) html or something. > > Please let me know if I can be of any more help. Thanks, -Darin ---------------------------------------------------------------------------- Here is my imports.html: <!-- custom style sheets--> <link rel="stylesheet" href="css/splash.css"> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/fade-title-animation.css"> <link rel="stylesheet" href="css/paper-ripple.css"> <link rel="stylesheet" href="css/slider-animation.css"> <link rel="stylesheet" href="bower_components/components-font-awesome/css/font-awesome.min.css"> <!-- custom style sheets--> <!-- bower components --> <link rel="import" href="bower_components/paper-menu/paper-menu.html"> <link rel="import" href="bower_components/paper-item/paper-item.html"> <link rel="import" href="bower_components/paper-drawer-panel/paper-drawer-panel.html"> <link rel="import" href="bower_components/iron-flex-layout/iron-flex-layout.html"> <link rel="import" href="bower_components/paper-header-panel/paper-header-panel.html"> <link rel="import" href="bower_components/iron-collapse/iron-collapse.html"> <link rel="import" href="bower_components/iron-icon/iron-icon.html"> <link rel="import" href="bower_components/iron-icons/editor-icons.html"> <link rel="import" href="bower_components/paper-ripple/paper-ripple.html"> <link rel="import" href="bower_components/iron-icons/iron-icons.html"> <link rel="import" href="bower_components/iron-icons/image-icons.html"> <link rel="import" href="bower_components/paper-toolbar/paper-toolbar.html"> <link rel="import" href="bower_components/paper-material/paper-material.html"> <link rel="import" href="bower_components/paper-card/paper-card.html"> <link rel="import" href="bower_components/iron-media-query/iron-media-query.html"> <link rel="import" href="bower_components/paper-fab/paper-fab.html"> <link rel="import" href="bower_components/paper-button/paper-button.html"> <link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="bower_components/paper-tabs/paper-tabs.html"> <!-- bower components --> <!-- custom elements --> <link rel="import" href="elements/portfolio/cards/card-behavior.html"> <link rel="import" href="elements/page-behavior.html"> <link rel="import" href="elements/page-styles.html"> <link rel="import" href="elements/footer-custom.html"> <link rel="import" href="elements/toolbar-menus/paper-menu-custom.html"> <link rel="import" href="elements/toolbar-menus/paper-tabs-custom.html"> <link rel="import" href="elements/portfolio/cards/portfolio-card-styles.html"> <link rel="import" href="elements/portfolio/portfolio-display.html"> <link rel="import" href="elements/portfolio/portfolio-page.html"> <link rel="import" href="elements/portfolio/cards/cloud-share-image-card.html"> <link rel="import" href="elements/portfolio/cards/cloud-monitor-card.html"> <link rel="import" href="elements/portfolio/cards/legacy-darin-card.html"> <link rel="import" href="elements/portfolio/cards/dad-site-card.html"> <link rel="import" href="elements/portfolio/cards/gulp-newy-card.html"> <link rel="import" href="elements/portfolio/cards/darin-hensley-card.html"> <link rel="import" href="elements/portfolio/cards/krunch-uploader-card.html"> <link rel="import" href="elements/resume/resume-page.html"> <link rel="import" href="elements/resume/resume-display.html"> <link rel="import" href="elements/contact-display.html"> <!-- custom elements --> <!-- js --> <script src="js/misc.js" ></script> <script src="bower_components/page/page.js"></script> <script src="js/router.js"></script> <script src="js/resume.js"></script> <script src="js/pdf.js"></script> <script src="js/pdf.worker.js"></script> <script src="js/initialize.js" defer></script> <!-- js --> Here is my nginx config for headers: ####################### # custom style sheets # ####################### add_header Link '</css/splash.css>; rel=preload; as=stylesheet'; add_header Link '</css/main.css>; rel=preload; as=stylesheet'; add_header Link '</css/fade-title-animation.css>; rel=preload; as=stylesheet'; add_header Link '</css/paper-ripple.css>; rel=preload; as=stylesheet'; add_header Link '</css/slider-animation.css>; rel=preload; as=stylesheet'; add_header Link '</css/chrome-shadow.html>; rel=preload; as=stylesheet'; add_header Link '</css/non-chrome-shadow.html>; rel=preload; as=stylesheet'; add_header Link '</bower_components/components-font-awesome/css/font-awesome.min.css>; rel=preload; as=stylesheet'; ######### # fonts # ######### add_header Link '</fonts/RobotoMono-Regular.ttf>; rel=preload; as=font'; add_header Link '</fonts/Roboto-Regular.ttf>; rel=preload; as=font'; ########## # images # ########## add_header Link '</favicon.ico>; rel=preload; as=image'; add_header Link '</img/cloud-share-image.png>; rel=preload; as=image'; add_header Link '</img/cloud-monitoring.png>; rel=preload; as=image'; add_header Link '</img/legacy-resume-min.jpg>; rel=preload; as=image'; add_header Link '</img/dad-min.jpg>; rel=preload; as=image'; add_header Link '</img/gulp-newy.jpg>; rel=preload; as=image'; add_header Link '</img/polymer-icon.png>; rel=preload; as=image'; add_header Link '</img/krunch.png>; rel=preload; as=image'; #add_header Link '<>; rel=preload; as=image'; ################################# # bower components dependencies # ################################# add_header Link '</bower_components/paper-behaviors/paper-button-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-menu-behavior/iron-menu-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-styles/paper-styles.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-menu/paper-menu-shared.css>; rel=preload; as=import'; add_header Link '</bower_components/iron-behaviors/iron-control-state.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-behaviors/iron-button-state.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-item/paper-item-shared-styles.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-selector/iron-selector.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-resizable-behavior/iron-resizable-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-meta/iron-meta.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-iconset-svg/iron-iconset-svg.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-styles/shadow.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-flex-layout/classes/iron-flex-layout.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-styles/default-theme.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-styles/color.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-behaviors/paper-button-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-behaviors/paper-inky-focus-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-menu-behavior/iron-menubar-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-tabs/paper-tabs-icons.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-tabs/paper-tab.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-selector/iron-multi-selectable.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-styles/typography.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-behaviors/paper-ripple-behavior.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-flex-layout/classes/iron-shadow-flex-layout.html>; rel=preload; as=import'; add_header Link '</bower_components/font-roboto/roboto.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-selector/iron-selectable.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-selector/iron-selection.html>; rel=preload; as=import'; add_header Link '</bower_components/components-font-awesome/fonts/fontawesome-webfont.woff2?v=4.5.0>; rel=preload; as=import'; add_header Link '</bower_components/polymer/polymer-mini.html>; rel=preload; as=import'; add_header Link '</bower_components/polymer/polymer-micro.html>; rel=preload; as=import'; #add_header Link '<>; rel=preload; as=import'; #################### # bower components # #################### add_header Link '</bower_components/polymer/polymer.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-menu/paper-menu.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-item/paper-item.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-drawer-panel/paper-drawer-panel.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-flex-layout/iron-flex-layout.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-header-panel/paper-header-panel.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-collapse/iron-collapse.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-icon/iron-icon.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-icons/editor-icons.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-ripple/paper-ripple.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-icons/iron-icons.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-icons/image-icons.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-toolbar/paper-toolbar.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-material/paper-material.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-card/paper-card.html>; rel=preload; as=import'; add_header Link '</bower_components/iron-media-query/iron-media-query.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-fab/paper-fab.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-button/paper-button.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-icon-button/paper-icon-button.html>; rel=preload; as=import'; add_header Link '</bower_components/paper-tabs/paper-tabs.html>; rel=preload; as=import'; ################### # custom elements # ################### add_header Link '</elements/portfolio/cards/card-behavior.html>; rel=preload; as=import'; add_header Link '</elements/page-behavior.html>; rel=preload; as=import'; add_header Link '</elements/page-styles.html>; rel=preload; as=import'; add_header Link '</elements/footer-custom.html>; rel=preload; as=import'; add_header Link '</elements/toolbar-menus/paper-menu-custom.html>; rel=preload; as=import'; add_header Link '</elements/toolbar-menus/paper-tabs-custom.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/portfolio-card-styles.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/portfolio-display.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/portfolio-page.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/cloud-share-image-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/cloud-monitor-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/legacy-darin-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/dad-site-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/gulp-newy-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/darin-hensley-card.html>; rel=preload; as=import'; add_header Link '</elements/portfolio/cards/krunch-uploader-card.html>; rel=preload; as=import'; add_header Link '</elements/resume/resume-page.html>; rel=preload; as=import'; add_header Link '</elements/resume/resume-display.html>; rel=preload; as=import'; add_header Link '</elements/contact-display.html>; rel=preload; as=import'; add_header Link '</imports.html>; rel=preload; as=import'; ###### # js # ###### add_header Link '</js/polyfill.js>; rel=preload; as=script'; add_header Link '</js/misc.js>; rel=preload; as=script'; add_header Link '</bower_components/page/page.js>; rel=preload; as=script'; add_header Link '</js/router.js>; rel=preload; as=script'; add_header Link '</js/resume.js>; rel=preload; as=script'; add_header Link '</js/pdf.js>; rel=preload; as=script'; add_header Link '</js/pdf.worker.js>; rel=preload; as=script'; add_header Link '</js/initialize.js>; rel=preload; as=script'; ##### #pdf# ##### add_header Link '</img/darin_hensley_resume.pdf>; rel=preload; as=pdf'; On Tue, Feb 16, 2016 at 8:22 PM, Justin Fagnani <[email protected]> wrote: > Can you post the ordering of the files? The timeline screenshot didn't > give much info. Again, to clarify, the html files are actually arriving > later? > On Feb 16, 2016 6:18 PM, "Darin Hensley" <[email protected]> wrote: > >> Yes, I mean the time per a individual file is much shorter with http2 >> push. I had this both on an Amazon and Rackspace server...one Ubuntu and >> one Gentoo.... and had the same user experience. The set up is pretty >> simple, so I don't think I was doing anything wrong...nothing pointed out >> in the github issue I filed for nghttpx. Not sure where the problem would >> be. I liked be able to brag I was using http2 push and not having to worry >> about concatenation, but happy enough without it. >> >> >> >> >> >> On Tuesday, February 16, 2016 at 12:57:47 PM UTC-6, Justin Fagnani wrote: >>> >>> I'm trying to follow along here, but I'm having some trouble seeing >>> what's happening. The timeline images you have don't show the .html files, >>> so I can't see when they're downloaded. When you say "The individual >>> time on the files requested are much shorter" do you only mean that the >>> time per file is shorter, or do you also mean that the timeline is showing >>> that they're downloaded earlier? >>> >>> I'm particularly interested in the case where the files are downloaded >>> earlier with http2 push, but DOMContentLoaded is still firing later. That >>> would indicate that something is going wrong in the browser that delays the >>> ready/load events. The other case, where the files download quicker, but >>> later in the timeline, would line up with the diagnosis that this is a >>> server-related issue, or priority+push support in the browser. >>> >>> Cheers, >>> Justin >>> >>> >>> On Mon, Feb 15, 2016 at 10:07 AM, Eric Bidelman <[email protected]> >>> wrote: >>> >>>> AFAIK, App engine's h2 push doesn't push based on priority. It pushes >>>> all resources at high priority. I'm not sure Chrome even supports resource >>>> prioritization (yet) for h2 push. But this could definite be a source of >>>> your issue if your sure env is pushing html files at a lower priority. >>>> >>>> One thing you could do is still vulcanize, and vulcanize with crisper. >>>> Then h2 push the .js file separately from the rest of the .html. >>>> >>>> On Sun, Feb 14, 2016 at 5:11 PM Darin Hensley <[email protected]> >>>> wrote: >>>> >>>>> >>>>> Not at the moment....but curious, ya'll did your http2 push testing >>>>> with Google App engine, correct? I don't have a google cloud(using the >>>>> Amazon free for a year cloud) and so I use nginx with nghttpx. I asked the >>>>> author and he mentioned it could be that html files get the lowest >>>>> prioritization in http2 push. >>>>> >>>>> Here is the thread for more information: >>>>> >>>>> https://github.com/tatsuhiro-t/nghttp2/issues/501 >>>>> >>>>> Can I please get your opinion/input on it? I'm basically resorting >>>>> back to vulcanize and not pushing the html files. >>>>> >>>>> >>>>> On Sunday, February 7, 2016 at 7:25:02 PM UTC-6, [email protected] >>>>> wrote: >>>>>> >>>>>> Huh, that's unexpected, and I haven't seen that in our tests. Do you >>>>>> have a demo deployed anywhere that we can test with? >>>>> >>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>> --- >>>>> You received this message because you are subscribed to the Google >>>>> Groups "Polymer" group. >>>>> To unsubscribe from this group and stop receiving emails from it, send >>>>> an email to [email protected]. >>>>> To view this discussion on the web visit >>>>> https://groups.google.com/d/msgid/polymer-dev/3ce650e5-52f7-4ee7-8e18-67925ea41bd0%40googlegroups.com >>>>> <https://groups.google.com/d/msgid/polymer-dev/3ce650e5-52f7-4ee7-8e18-67925ea41bd0%40googlegroups.com?utm_medium=email&utm_source=footer> >>>>> . >>>>> For more options, visit https://groups.google.com/d/optout. >>>>> >>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>> --- >>>> You received this message because you are subscribed to the Google >>>> Groups "Polymer" group. >>>> To unsubscribe from this group and stop receiving emails from it, send >>>> an email to [email protected]. >>>> To view this discussion on the web visit >>>> https://groups.google.com/d/msgid/polymer-dev/CACGqRCCcsoTUC-TE%3DtoHVMod13uFbOSj67T-MGD7%2BDH8nU9DAQ%40mail.gmail.com >>>> <https://groups.google.com/d/msgid/polymer-dev/CACGqRCCcsoTUC-TE%3DtoHVMod13uFbOSj67T-MGD7%2BDH8nU9DAQ%40mail.gmail.com?utm_medium=email&utm_source=footer> >>>> . >>>> >>>> For more options, visit https://groups.google.com/d/optout. >>>> >>> >>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >> --- >> You received this message because you are subscribed to the Google Groups >> "Polymer" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected]. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/polymer-dev/e849778d-3e94-4f53-97ed-5149236b15f4%40googlegroups.com >> <https://groups.google.com/d/msgid/polymer-dev/e849778d-3e94-4f53-97ed-5149236b15f4%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> For more options, visit https://groups.google.com/d/optout. >> > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAKMWEBwX9u8n668gMuDC47Q_iF22139B54WTm6x7qgTYEy6BqQ%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
