Angular's Lazy Loading is a super powerful feature. By splitting your code into modules, and loading those modules only when needed by the current route, your users get the best of both worlds in terms of a single cohesive application, while only loading the code needed for their current experience.
But what happens when Angular and the CLI generate one of these lazy loaded chunks? Let's dig into one and find out.
I've built an "AboutModule" and an "AboutComponent" which is routed to by default with the empthy path. The code itself is about 1K before compression, and is actually pretty straightforward.
Here's a lazy loaded chunk of JavaScript generated by ng build -prod. I've added comments to explain what's going on in each piece.
0.da70.chunk.js
// Wrap my code via webpack and JSONP so that it can be loaded and executed from the server.
webpackJsonp([0], {
  c7AP: function(n, u, l) {
      "use strict";
      function t(n) {
          // Here we see my "about works" template and the wrapping tag whitespace
          return r._27(0, [(n()(),
          r._14(0, null, null, 1, "p", [], null, null, null, null, null)), (n()(),
          r._26(null, ["\n  about works!\n"])), (n()(),
          r._26(null, ["\n"]))], null, null)
      }
      // Here we see my selector
      function o(n) {
          return r._27(0, [(n()(),
          r._14(0, null, null, 1, "app-about", [], null, null, null, t, _)), r._12(114688, null, 0, c, [], null, null)], function(n, u) {
              n(u, 1, 0)
          }, null)
      }
      // This is an ES Module
      Object.defineProperty(u, "__esModule", {
          value: !0
      });
      var r = l("/oeL")
        , e = function() {
          function n() {}
          return n
      }()
        , c = function() {
          function n() {}
          return n.prototype.ngOnInit = function() {}
          ,
          n.ctorParameters = function() {
              return []
          }
          ,
          n
      }()
      // Set the properties of the Component
        , i = []
        , _ = r._11({
          // View Encapsulation: Emulated
          encapsulation: 2,
          // No styles this time (empty array)
          styles: i,
          data: {}
      })
        , a = r._9("app-about", c, o, {}, {}, [])
        , f = l("qbdv")
        , p = l("BkNc")
        , b = function() {
          function n() {}
          return n
      }();
      // Here we have my NgModule
      l.d(u, "AboutModuleNgFactory", function() {
          return s
      });
      var s = r._10(e, [], function(n) {
          // My ngModule imports some things and declares some things
          return r._23([r._24(512, r.k, r._7, [[8, [a]], [3, r.k], r.E]), r._24(4608, f.i, f.h, [r.A]), r._24(512, f.b, f.b, []), r._24(512, p.l, p.l, [[2, p.q], [2, p.k]]), r._24(512, b, b, []), r._24(512, e, e, []), r._24(1024, p.i, function() {
              // Here we see my simple routing config
              return [[{
                  path: "",
                  component: c
              }]]
          }, [])])
      })
  }
});