Türker Yıldırım

webpack

  • Bootstrap 4 dropped the float grid

    Deep dive10 min read

    Two and a half years in alpha, and the grid is flexbox now. The class renames are mechanical; the ones that changed meaning rather than name are not.

  • Code splitting with dynamic import

    Note1 min read

    Shipping the checkout code to everyone who visits the homepage is the default, because a single entry point produces a single bundle. A dynamic import is a split…

  • webpack 2 tree shaking needs ES modules all the way down

    Note1 min read

    Tree shaking is presented as a webpack 2 feature and is really a property of ES modules: the imports have to be statically analysable, which means Babel must…

  • CommonsChunkPlugin is confusing and about to be replaced

    Note1 min read

    Splitting vendor code from application code so the vendor bundle can be cached separately is the most common webpack requirement and, this year, the one with the worst…

  • Mix is webpack with the config already written

    Note1 min read

    Elixir wrapped gulp, which wrapped everything else. Mix wraps webpack directly, which removes a layer and — more usefully — leaves the underlying configuration reachable when the abstraction…

  • CSS Grid arrived, and the layout hacks can go

    Deep dive9 min read

    Chrome 57 and Firefox 52 shipped it a fortnight apart in March. Replacing a grid system of nested rows, negative margins and a clearfix with fourteen lines.

  • webpack 3 scope hoisting, and what it actually saves

    Note1 min read

    webpack wraps every module in a function, which costs a closure per module at parse and at runtime. Scope hoisting concatenates modules that can safely share a scope…

  • The asset pipeline Laravel 5.4 shipped

    Deep dive8 min read

    Elixir wrapped gulp, which wrapped everything else. Mix wraps webpack directly — and leaves the configuration reachable when the abstraction runs out.

  • webpack resolve.alias removes the ../../..

    Note2 min read

    A deep component importing a helper writes ../../../lib/money, and the path breaks the moment the file moves — which makes reorganising a tree a mechanical exercise in fixing…

  • Source maps in production without shipping the source

    Note1 min read

    Minified stack traces are unreadable, and the usual fix — shipping source maps — publishes the original source to anyone who opens devtools. Both problems have the same…