Blog

performance
speedcurve
CLS
web vital
micro-frontends
module federation
component library
ui
Azure devops
Cypress
Integration tests
Testing
h-include
React
Animation
Spritelove
React Native
composition
classification
webpack
scs
architecture
Performance
svelte
prerendering
dx
progressive-enhancement
alpine
SpeedCurve
WebPageTest

Micro frontends with Module Federation and Webpack 5

2020.10.19 | MICRO-FRONTENDS, MODULE FEDERATION, WEBPACK

The release of Webpack 5 delivered something special besides performance improvements like improved tree-shaking and persistent caching across builds - an architectural possibility called Module Federation.

All posts (15)

Web perf basics - Performance Budgets

2021.10.01 | H-INCLUDE

Climbing the performance ladder requires hard work, learn how to prevent regressions and enjoy the view.

Introduction to CLS - Cumulative Layout Shift

2021.09.18 | PERFORMANCE, SPEEDCURVE, CLS, WEB VITAL

In this post we'll quickly look at what CLS is, how it's measured within Speedcurve and tips on how to mitigate layout shifts.

Composition and Classification of micro frontends

2020.11.02 | MICRO-FRONTENDS, COMPOSITION, CLASSIFICATION

In this post, Per Ökvist and I will try to zoom-out and take a look at the large puzzle regarding web-composition

Creating a Module federated UI library with Webpack 5

2020.10.29 | MICRO-FRONTENDS, MODULE FEDERATION, COMPONENT LIBRARY, UI

In this post we'll look at how we can use Module Federation to create a component UI library using Module Federation and Webpack 5.

Micro frontends with Module Federation and Webpack 5

2020.10.19 | MICRO-FRONTENDS, MODULE FEDERATION, WEBPACK

The release of Webpack 5 delivered something special besides performance improvements like improved tree-shaking and persistent caching across builds - an architectural possibility called Module Federation.

Authoring progressive enhanced fragments with Alpine

2020.10.07 | PROGRESSIVE-ENHANCEMENT, PERFORMANCE, MICRO-FRONTENDS, SCS, ALPINE

In this post we’ll explore progressive enhanced behavior & templating over static content.

Prerendering static, hydratable fragments with Svelte

2020.10.03 | SVELTE, PRERENDERING, MICRO-FRONTENDS, SCS, DX

In this post we’ll look at some of the different options we have when writing fragments, how they stand in terms on DX and take a deeper view into prerendering with Svelte.

Micro-frontends & SCS

2020.09.15 | MICRO-FRONTENDS, SCS, PERFORMANCE, ARCHITECTURE

Micro-frontends architecture is the adoption of micro-services extended all the way to the UI layer. Due to the nature of our ever-changing frontend eco system, micro-frontends offers us the option to independently invest in certain key areas of our UI and to optimize throughput by grouping the right people together.

Declarative client-side transclusion with h-include

2020.09.12 | H-INCLUDE

h-include is a javascript library for including fragments client side (client side transclusion), perfect fit for micro-frontend architecture in combination with server-side transclusion technologies like ESI.

PostCSS media queries

2020.06.14 | PERFORMANCE

There’s a neat little plugin for postCSS called postcss-extract-media-query and I think it's awesome.

Introducing Spritelove

2020.06.13 | SPRITELOVE, REACT, REACT NATIVE, ANIMATION

Spritelove is a personal project of mine that I really enjoy working on from time to time, even though I only work on it on my spare time I think it's long overdue a proper introduction.

Cypress - preserve cookies between tests

2020.03.12 | CYPRESS, TESTING

Cypress - preserve cookies between tests

Comparing tests in SpeedCurve

2020.03.10 | SPEEDCURVE, PERFORMANCE, WEBPAGETEST

Comparing tests in SpeedCurve

Cypress micro-frontend architecture on Azure Devops

2020.02.18 | AZURE DEVOPS, CYPRESS, INTEGRATION TESTS

Learn to setup Cypress for a micro-frontend architecture on Azure Devops

Introducing React Metro

2017.09.27 | REACT, ANIMATION

A tiny configurable wrapper for animating dom elements as they mount or unmount