angular-cli icon indicating copy to clipboard operation
angular-cli copied to clipboard

Support HTTP/2 Server Push

Open kimamula opened this issue 7 years ago • 6 comments

Bug Report or Feature Request (mark with an x)

- [ ] bug report -> please search issues before submitting
- [x] feature request

Desired functionality

polymer-cli and preact-cli generate push-manifest.json which maps incoming request paths to the additional resources that should be pushed with it and is to be interpreted by a tool like prpl-server-node.

It would be great if angular-cli provide the similar functionality.

kimamula avatar Aug 20 '18 02:08 kimamula

It may not be easy to create push-manifest.json as Angular currently probably does not analyze which resources are required in each path in build time.

An alternative solution would be:

  1. Create a webpack plugin that generates a file that maps module paths to resources
// An example output of the webpack plugin
{
  // Resources which are always required are included in ""
  "": {
    "runtime.3e827d1a10b9047735bc.js": "script",
    "main.e8725b5004466c1664e1.js": "script",
    "polyfills.43f2535cedd6fe44b10e.js": "script",
    "styles.34c57ab7888ec1573f9c.css": "style"
  },
  "./lazy/lazy.module": {
    "0.8c6a7127511b5f2ffe40.js": "script"
  }
}
  1. require the file created above and pass it to ngExpressEngine function in an Angular Universal app.
  2. Provide LinkPreloadHeadersSetter, which creates link preload headers based on paths of required modules using the map, in Universal engines (express-engine, for example), and call its onLoad method in ModuleMapNgFactoryLoader#load.

Demo: https://angular-prpl.appspot.com/

angular-push-demo

(Chrome users may have to disable Experimental QUIC protocol in about:flags to make HTTP/2 Server Push work)

Diffs:

An apparent drawback of this approach is that you can use HTTP/2 Server Push only in Angular Universal apps.

kimamula avatar Sep 03 '18 07:09 kimamula

I have created a library based on the above idea, though I have not tested it thoroughly.

https://github.com/kimamula/ngx-server-push

kimamula avatar Sep 06 '18 14:09 kimamula

I was looking for the possibility of enabling push on an angular 9 / ionic app. Any news?

bogomips avatar May 23 '20 10:05 bogomips

I would say that this is out of scope for the Angular CLI.

Because, for a proper configuration, besides the JavaScript and styles, each project also requires various static resources to properly bootstrap and render the application. If you really want to generate that file, you can use a 3rd party builder or write what that allows you to generates that file with the appropriate content.

And server push in Ionic applications isn't supported, they use a local web server. This would be useful if you are serving them on the web, which already requires you to tweak the application depending on the platform (you need to disable preloadingStrategy: PreloadAllModules on the web), so this calls for more custom configurations. And I think that these things shouldn't be maintained by the Angular CLI team, they should focus on maintaining other features.

SchnWalter avatar May 25 '20 09:05 SchnWalter

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

angular-robot[bot] avatar Feb 01 '22 18:02 angular-robot[bot]

Thank you for submitting your feature request! Looks like during the polling process it didn't collect a sufficient number of votes to move to the next stage.

We want to keep Angular rich and ergonomic and at the same time be mindful about its scope and learning journey. If you think your request could live outside Angular's scope, we'd encourage you to collaborate with the community on publishing it as an open source package.

You can find more details about the feature request process in our documentation.

angular-robot[bot] avatar Feb 21 '22 13:02 angular-robot[bot]