Speed docker build up the build by 10X times for frontend applications

ivolkoff — Wed, 18 Jan 2023 13:12:44 +0000

I'm developing on macOS, and my Kubernetes cluster is on linux.

The configuration before was:

Dockerfile:

FROM node:14.17-alpine as a builder
...
FROM nginx
...

I ran the command:

docker build --platform linux/amd64 -t fe-spa:latest .

The assembly began to take 20 minutes

I changed the configuration and started doing this:

Dockerfile:

FROM node:14.17-alpine as a builder
...
FROM --platform linux/amd64 nginx
...

I ran the command:

docker build -t fe-spa:latest .

The assembly began to take 2 minutes

the transfer of the platform selection allowed us to get an increase in speed

CSS rendering .deliver in list

ivolkoff — Sat, 31 Dec 2022 12:24:19 +0000

In the project I use a menu component with conditional rendering.
The problem happened in the display of menu item separators, because some entries may not be rendered.
Example 1 is the first state when all menu items are visible.
Example 2 and 3 are the state when some elements are not rendered in the component.

I wrote such a selector to hide the line elements.

<style>
  .deliver:has(+ .deliver),
  .deliver + .deliver:not(:has(+ *)) {
    display: none;
  }
</style>

Code example https://codepen.io/ivolkoff/pen/ExpKBvg

Forem: ivolkoff

Speed docker build up the build by 10X times for frontend applications

CSS rendering .deliver in list