New Pluralsight Course – Creating Custom Builds with Dojo
Types of Optimizations
Many Dojo applications take advantage of the powerful widgeting framework that comes included in Dojo called Dijit. These custom widgets often involve the creation of HTML templates that form the structure of the widget. In a non-trivial application, this can lead to dozens or hundreds of HTTP calls being made. The build system handle this by detecting when a widget that is part of a layer includes a template. These templates are then built into the layer, just like all of the other dependencies so that no requests are required to load them.
If you have been working with client-side for any length of time, then you probably have a structure similar to this in your project:
This keeps all of the files nicely organized and works for many applications. However, when using Dojo and its build system, the best approach is to do this:
Notice that the CSS has been moved into the app folder. Assuming that the app folder is a Dojo package, then the build system is able to detect these files. When it discovers a CSS file, it will take two actions. First, as you might expect, the CSS is compressed and any unnecessary white space is eliminated. Additionally, the build system will look for any @import directives and, when discovered will include the imported CSS directly into the requested file. This combined bundling and minification ensures that the styling of the application is delivered in the most efficient way possible.
What is Covered?
While Dojo’s build system is well documented on Dojo Toolkit.org, it can be a bit intimidating to navigate the huge number of options that are available to tune a build to deliver an optimized experience. My Pluralsight course breaks down the build system and deals the components one at a time. Each concept of each step is introduced individually and normally accompanied by a demo that shows the impact of that specific setting. Over the two hours of the course, this provides a strong understand of each component of the system and how they integrate together. The final module even covers quite a few options that are useful in some scenarios, but might not be useful in every project.
Feel free to check the course out and let me know what you think