This document discusses different options for web development workflows in Visual Studio, including using runtime optimizations, Visual Studio plugins, and task runners. It provides examples of specific plugins and task runners like Bundler and Minifier, Web Compiler, Web Essentials, Gulp, and Bower. The document analyzes the pros and cons of each approach and recommends the best option depending on a project's complexity, build integration needs, and optimization goals.
12. Visual Studio Plugins
• Pros
• Low-ishComplexity
• More Features than Runtime Optimizations
• BuildTime Optimizations
• Cons
• Ensuring developers have plugins installed and up-to-date
• Challenging Integration with Build Servers
• Clumsy Cache Busting in MVC5
13. Task Runners
• Build System for Front-EndWeb Dev
• Collection of Node.js packages
• Task basked
• Asset Pipeline
http://gulpjs.com
It all started with jQuery, which allowed us to do more interesting things in JS than we used it.
As a result, we started writing a lot more JS in our apps
Some people wanted a little more from JS as a language. We ended up with languages like CofffeeScript and TypeScript that compile down to JS.
While all this was happening, the HTML5 and CSS3 specs were evolving, again allowing us to do more interesting things in the browser.
Much like we have CoffeeScript and TypeScript for JS, we ended up with higher level languages like LESS and SASS that compile down to CSS. These languages extended CSS by allowing for things like reusable methods and variables in CSS. Again though, this meant that our source could not simply be published directly to the server. There are steps that need to happen in between.
Some very smart people built great CSS frameworks like Bootstrap and Foundation for us so that we didn’t have to reinvent the wheel for every app we built.
As more and more complex applications were being built, people started to want features like data binding that we were used to in platforms like WPF. That’s how Knockout came to be. That just seemed to open up the flood gates as everyone and their dog developed a javascript application framework. It looked like we were at least generally settling on a common approach when Facebook decided to join the show.
Finally, with all these great frameworks and libraries that we can use, people realized we needed a way to manage packages and their dependencies. Enter npm for node and bower for client libraries.
I like to think of these tasks as a few different things.
Web Optimization – Tasks like bundling and minification
Tedious Developer Tasks – Compiling TypeScript or Less files, Ensuring browser compat with vendor prefixes
Code Improvements – Code checkers like jshint…similar conceptually to fxcop
With all these tasks that we need to manage before publishing a web application, we needed some kind of solution to help coordinate it all. Enter Grunt an Gulp, the most popular task runners.
Bundles are configured in C# and created at runtime based on environment settings
Show how JS bundles work with the Bundler extension
Talk about Less / Bootstrap
-Themes: http://bootstrap-live-customizer.com/
Customize bootstrap by adding LESS and including the right files
Talk about Cache Busting. Show how this can be accomplished
---http://madskristensen.net/post/cache-busting-in-aspnet
The fact that it uses git is actually really important. You can easily fork an existing library and point to your fork instead of waiting on some stale project to get a bug fix.