A Web is a Web is a Web

 
event

NMoneys.Web is a web application. End of post. Next.

Foundations

For those of us that have little expertise in writing sensible, structured, not-disgusting HTML or CSS, HTML frameworks are Godsend.

I have used Bootstrap but I preferred NMoneys.Web not to look like 90% if the Internet, so I had one of two:

  1. tweak Bootstrap myself
  2. trust someone to customize it

1) was not an option and after toying with some Metro-looking frameworks (and feeling as lost as a jellyfish in Mojave), option 2) crystalized when I found out Flat UI. Flat UI makes Bootstrap look more Metro Modern but still tastes as Bootstrap.

Flat UI is really nice, but please, do not use it. Or if do, customize the hell out of it. The last thing you want is your site looking like NMoneys.Web, don’t you? Smile with tongue out

Pack it really tight

Caring about page footprint is not reserved anymore to insanely visited sites. Nowadays, libraries, better practices and solutions are easily available for everyone. And so everyone should care about bundling and minification of web assets.

In have used Cassette in the past. I liked it. It works. But I have the feeling that, in the end, it will be predated by Microsoft’s own solution because it is good enough for most purposes. Purposes like NMoneys.Web.

And I have to admit that I liked it a lot. It was easy to fulfill my modest requirements and I think that CDN support is pretty nicely handled (not that is a terribly difficult problem to solve). So now all my third-party assets are served from several CDNs: Google Hosted Libraries for jQuery, Bootstrap CDN for Bootstrap and cdnjs for everything else (Parsley and Prettify).

You can check my bundling configuration here. If you see something terribly (or even mildly) wrong, please let me know so that I can learn.

Curly-bracing

One thing I hated about some modern-non-intrusive Javascript that I have seen in quite a few places is having widely-shared pieces of script (sometimes quite chunky) throughout the site.
“It’s cheap”, they say, “they are very efficient selectors”, an they walked away without looking back at my tears rolling down my face. “Don’t worry, it’s cached”, the tried to comfort weeping me…

Sadly is the same thing I have seen in the server-side. Lack of modularity, Poor code architecture. It may be cached, but it still needs to be parsed. And the selectors are there, being executed. It may not be much, but it feels wrong.

And that I tried to avoid in NMoneys.Web and what I could do was:

  1. create a Razor sections for assets that go at the end of the body (@scripts) and another for those that go in the head (@head)
  2. create a script bundle for each “page” of the site. For example, one bundle for the script to be run in the /samples area
  3. render the bundle or bundles required for that single page in the right section

That way, only needed bundles are rendered in the page that uses them. They will be optimized and won’t hurt performance of other page. I totally understand that this simplistic approach is not 1:1 applicable when there are many resources to be shared; but like most things, it is a question of managing dependencies step by step.