7 ms·

Automatically minifying .cshtml files in .NET Core

31 points by bobblywobbles 8y ago

Novashi 8y ago
Neat, but I thought the view compilations were cached and optimized already? Wouldn't it be better to add a pipeline that minifies the compiled views instead of having files on disk?
- c0nfused 8y ago
  That does appear to be an option and one I would persue as well: https://www.softfluent.com/blog/dev/Enabling-gzip-compression-with-ASP-NET-Core https://www.softfluent.com/blog/dev/Enabling-gzip-compressio...
  - bobblywobbles 8y ago
    Gzip compression is good, but if you can also have your files minified it does provide more performance gains (even if marginal). If you have to set up minification once to gain ~3% reduction in page size, I think we would all do it (even though its 3%).
- sebazzz 8y ago
  I also think it is better to override the View Engine to allow the minified files to take precedence. Nevertheless I doubt that minification of the html is very useful unless you're Google. With cutting away dependencies and a good lazy loading strategy you can achieve a lot more.
  - bobblywobbles 8y ago
    The savings is marginal, but why not configure your solution to save extra bytes then forget it is even there?
    - sebazzz 8y ago
      Why? Because software is complex enough as it is, and you need to question whether you need to add additional moving parts for little benefit. Everything that you can add, can fail in some reason. Especially something like HTML minification, which cannot be transparently minified (for instance, when you need to use white-space: pre)
- bobblywobbles 8y ago
  I believe the following project does exactly that: WebMarkupMin.AspNetCore2. The one consideration to this project is that the minifications are done at runtime. Doing the minification before the application starts saves time from a pipeline minifying on the fly.
  - zamalek 8y ago
    The easiest hypothetical option would be to instruct the .cshtml code generator to ignore insignificant whitespace, but I don't think it currently supports that.
    - bobblywobbles 8y ago
      WebMarkupMin doesn't support that?
      - zamalek 8y ago
        I think it does post-processing on the HTML once it has been generated. ASP.Net works by generating an assembly from source files (like .cshtml) that essentially amounts to a whole bunch of `Response.Write("<HTML>")`. If it (Razor in this case) could be made aware of insignificant whitespace, it could omit the writes for whitespace.
  - Novashi 8y ago
    >Doing the minification before the application starts saves time from a pipeline minifying on the fly. That would only affect a cold-start (app pool recycle) or a view recompile before that'd be an performance concern, unless I don't understand how/when views are cached and then evicted from cache. If you have a lot of views with a lot of partial views inside them, then yeah, you'd only want to run minification once on the final view, instead of for every partial view. I'm not sure if you'd have (or want) that much control over the view rendering process. Btw it's a cool post if you're the author.
    - bobblywobbles 8y ago
NicoJuicy 8y ago
I knew how to do it, but the combined files are new through the settings file: MinifiedCshtml. I knew how to do that also ( manually) in the csproj file ( similar to resource files), but not how to do it automaticly (y) Thanks !
- bobblywobbles 8y ago
  You are welcome, I glad it helped.
caseymarquis 8y ago
Neat, but I’m curious to know how many people are using server side templating with dotnet core? I avoid it like the plague these days, using vue/webpack and an http api. If there’s actually a lot of razor still out there, I should probably keep up with the latest version of it.
- thrower123 8y ago
  A lot of times, that's all you need. For quick and dirty internal tools, its a godsend. I'd be happy to use it more, and cut out the whole Gordian Knot of overburdened front-end development.
  - caseymarquis 8y ago
    I’m hoping that wasm leads to a unified dotnet stack with fantastic tooling and shared classes for front-end development. Best of both worlds at that point. That said, I resisted getting into the JavaScript front-end ecosystem, but I really like it at this point.
  - skinnyarms 8y ago
    I've been doing some experimenting with Gatsby to generate static sites for me, and it's made me realize how much I've missed server-side rendering.
- nicoburns 8y ago
  I'm a full stack developer, so I'm pretty comfortable with the front end frameworks, but there's definitely still a place for traditional server-rendered apps. They're super fast (HN is a good example!), and dev work is much quicker for basic stuff that doesn't involve too much complex interaction.
- iamnothere 8y ago
  Blazor 1.0 is coming (eventually) which will make client-side Razor templating feasible. It runs C# code in the browser using WebAssembly, with fallback to asm.js for older browsers. Vue is probably the best general-purpose SPA frontend option for .NET right now, in my opinion, but I'm really hoping that Blazor unseats it. Being able to reuse library code in the frontend would be fantastic! I've got a few use cases for this already that would avoid round trips to the server or duplicating/maintaining logic in different languages.
romanovcode 8y ago
I think there is a better way. 1. Add package called `WebMarkupMin.AspNetCore2`. 2. Add and configure code in your `Startup.cs` like so. services.AddWebMarkupMin( options => { options.AllowMinificationInDevelopmentEnvironment = true; options.AllowCompressionInDevelopmentEnvironment = true; options.DisablePoweredByHttpHeaders = true; }) .AddHtmlMinification( options => { options.MinificationSettings.RemoveRedundantAttributes = true; options.MinificationSettings.RemoveHttpProtocolFromAttributes = true; options.MinificationSettings.RemoveHttpsProtocolFromAttributes = true; // More options if you like so }) .AddHttpCompression(); Not only will this minfy HTML output, but also apply a lot more optimisations based on your configuration.
- bobblywobbles 8y ago
  I'm open to adding more of the options that WebMarkupMin provide. The main difference between this and WebMarkupMin is that WebMarkupMin runs at runtime - therefore it is costing time to minify when you can already minify the files before launching your web application.
  - romanovcode 8y ago
    Yeah, that is true. However that HTML is usually cached so not a big deal. Also, this reduces complexity of the project. Both methods are fine, it's just I prefer this one.
rocky1138 8y ago
Does this actually do anything? Why not just gzip the transmission?
- bobblywobbles 8y ago
  Minification along with gzip gives slightly better compression than with gzip alone. Even if it is a slight gain, why not set it up once and forget it?
  - userbinator 8y ago
    You can think of it like PNG vs JPG --- the former is entropy-coding only, the latter has a lossy transform before entropy coding. Minification is a lossy transform, and if it didn't provide any benefits, no one would be using JPG or any lossy video format.
GordonS 8y ago
In all seriousness, is it really worth the effort and added complexity, when HTML is going to be compressed on the wire? What are you going to save, maybe a few bytes?
- bobblywobbles 8y ago
  The savings is marginal, but if you are able to set it up once and forget it, why not take advantage of a few % reduction in page size?
  - fiddlerwoaroof 8y ago
    Well, for one thing, minification makes debugging production issues needlessly difficult.
    - bobblywobbles 8y ago
      That might be the case for javascript or css, however even if the HTML is sent down minified, the browser will not show this minified HTML if you and Inspect it. Was there a specific case you were referring to?
  - GordonS 8y ago
    Because it adds complexity to the build process, for very little benefit. And I don't like complexity. To illustrate the point, let's take the current Hacker News front page: +=================+========+ | Description | Bytes | +=================+========+ | Original | 43,595 | +-----------------+--------+ | Minified | 41,368 | +-----------------+--------+ | Original (GZIP) | 7,350 | +-----------------+--------+ | Minified (GZIP) | 7,247 | +-----------------+--------+ You've saved 103 bytes, or ~1.4%.
    - bobblywobbles 8y ago
      That's true, but if you need that extra benefit then it's worth the cost. As long as the process is invisible for you once you set it up, would you justify the complexity for extra gain?

31 points by bobblywobbles 8y ago

Neat, but I thought the view compilations were cached and optimized already? Wouldn't it be better to add a pipeline that minifies the compiled views instead of having files on disk?

c0nfused 8y ago
That does appear to be an option and one I would persue as well: https://www.softfluent.com/blog/dev/Enabling-gzip-compression-with-ASP-NET-Core https://www.softfluent.com/blog/dev/Enabling-gzip-compressio...
- bobblywobbles 8y ago
  Gzip compression is good, but if you can also have your files minified it does provide more performance gains (even if marginal). If you have to set up minification once to gain ~3% reduction in page size, I think we would all do it (even though its 3%).
sebazzz 8y ago
I also think it is better to override the View Engine to allow the minified files to take precedence. Nevertheless I doubt that minification of the html is very useful unless you're Google. With cutting away dependencies and a good lazy loading strategy you can achieve a lot more.
- bobblywobbles 8y ago
  The savings is marginal, but why not configure your solution to save extra bytes then forget it is even there?
  - sebazzz 8y ago
    Why? Because software is complex enough as it is, and you need to question whether you need to add additional moving parts for little benefit. Everything that you can add, can fail in some reason. Especially something like HTML minification, which cannot be transparently minified (for instance, when you need to use white-space: pre)
bobblywobbles 8y ago
I believe the following project does exactly that: WebMarkupMin.AspNetCore2. The one consideration to this project is that the minifications are done at runtime. Doing the minification before the application starts saves time from a pipeline minifying on the fly.
- zamalek 8y ago
  The easiest hypothetical option would be to instruct the .cshtml code generator to ignore insignificant whitespace, but I don't think it currently supports that.
  - bobblywobbles 8y ago
    WebMarkupMin doesn't support that?
    - zamalek 8y ago
      I think it does post-processing on the HTML once it has been generated. ASP.Net works by generating an assembly from source files (like .cshtml) that essentially amounts to a whole bunch of `Response.Write("<HTML>")`. If it (Razor in this case) could be made aware of insignificant whitespace, it could omit the writes for whitespace.
- Novashi 8y ago
  >Doing the minification before the application starts saves time from a pipeline minifying on the fly. That would only affect a cold-start (app pool recycle) or a view recompile before that'd be an performance concern, unless I don't understand how/when views are cached and then evicted from cache. If you have a lot of views with a lot of partial views inside them, then yeah, you'd only want to run minification once on the final view, instead of for every partial view. I'm not sure if you'd have (or want) that much control over the view rendering process. Btw it's a cool post if you're the author.
  - bobblywobbles 8y ago

NicoJuicy 8y ago

I knew how to do it, but the combined files are new through the settings file: MinifiedCshtml. I knew how to do that also ( manually) in the csproj file ( similar to resource files), but not how to do it automaticly (y) Thanks !

bobblywobbles 8y ago
You are welcome, I glad it helped.

caseymarquis 8y ago

Neat, but I’m curious to know how many people are using server side templating with dotnet core? I avoid it like the plague these days, using vue/webpack and an http api. If there’s actually a lot of razor still out there, I should probably keep up with the latest version of it.

thrower123 8y ago
A lot of times, that's all you need. For quick and dirty internal tools, its a godsend. I'd be happy to use it more, and cut out the whole Gordian Knot of overburdened front-end development.
- caseymarquis 8y ago
  I’m hoping that wasm leads to a unified dotnet stack with fantastic tooling and shared classes for front-end development. Best of both worlds at that point. That said, I resisted getting into the JavaScript front-end ecosystem, but I really like it at this point.
- skinnyarms 8y ago
  I've been doing some experimenting with Gatsby to generate static sites for me, and it's made me realize how much I've missed server-side rendering.
nicoburns 8y ago
I'm a full stack developer, so I'm pretty comfortable with the front end frameworks, but there's definitely still a place for traditional server-rendered apps. They're super fast (HN is a good example!), and dev work is much quicker for basic stuff that doesn't involve too much complex interaction.
iamnothere 8y ago
Blazor 1.0 is coming (eventually) which will make client-side Razor templating feasible. It runs C# code in the browser using WebAssembly, with fallback to asm.js for older browsers. Vue is probably the best general-purpose SPA frontend option for .NET right now, in my opinion, but I'm really hoping that Blazor unseats it. Being able to reuse library code in the frontend would be fantastic! I've got a few use cases for this already that would avoid round trips to the server or duplicating/maintaining logic in different languages.

romanovcode 8y ago

I think there is a better way. 1. Add package called `WebMarkupMin.AspNetCore2`. 2. Add and configure code in your `Startup.cs` like so. services.AddWebMarkupMin( options => { options.AllowMinificationInDevelopmentEnvironment = true; options.AllowCompressionInDevelopmentEnvironment = true; options.DisablePoweredByHttpHeaders = true; }) .AddHtmlMinification( options => { options.MinificationSettings.RemoveRedundantAttributes = true; options.MinificationSettings.RemoveHttpProtocolFromAttributes = true; options.MinificationSettings.RemoveHttpsProtocolFromAttributes = true; // More options if you like so }) .AddHttpCompression(); Not only will this minfy HTML output, but also apply a lot more optimisations based on your configuration.

bobblywobbles 8y ago
I'm open to adding more of the options that WebMarkupMin provide. The main difference between this and WebMarkupMin is that WebMarkupMin runs at runtime - therefore it is costing time to minify when you can already minify the files before launching your web application.
- romanovcode 8y ago
  Yeah, that is true. However that HTML is usually cached so not a big deal. Also, this reduces complexity of the project. Both methods are fine, it's just I prefer this one.

rocky1138 8y ago

Does this actually do anything? Why not just gzip the transmission?

bobblywobbles 8y ago
Minification along with gzip gives slightly better compression than with gzip alone. Even if it is a slight gain, why not set it up once and forget it?
- userbinator 8y ago
  You can think of it like PNG vs JPG --- the former is entropy-coding only, the latter has a lossy transform before entropy coding. Minification is a lossy transform, and if it didn't provide any benefits, no one would be using JPG or any lossy video format.

GordonS 8y ago

In all seriousness, is it really worth the effort and added complexity, when HTML is going to be compressed on the wire? What are you going to save, maybe a few bytes?

bobblywobbles 8y ago
The savings is marginal, but if you are able to set it up once and forget it, why not take advantage of a few % reduction in page size?
- fiddlerwoaroof 8y ago
  Well, for one thing, minification makes debugging production issues needlessly difficult.
  - bobblywobbles 8y ago
    That might be the case for javascript or css, however even if the HTML is sent down minified, the browser will not show this minified HTML if you and Inspect it. Was there a specific case you were referring to?
- GordonS 8y ago
  Because it adds complexity to the build process, for very little benefit. And I don't like complexity. To illustrate the point, let's take the current Hacker News front page: +=================+========+ | Description | Bytes | +=================+========+ | Original | 43,595 | +-----------------+--------+ | Minified | 41,368 | +-----------------+--------+ | Original (GZIP) | 7,350 | +-----------------+--------+ | Minified (GZIP) | 7,247 | +-----------------+--------+ You've saved 103 bytes, or ~1.4%.
  - bobblywobbles 8y ago
    That's true, but if you need that extra benefit then it's worth the cost. As long as the process is invisible for you once you set it up, would you justify the complexity for extra gain?