in ,

Shrinking my static sites Docker image from 419MB to 39MB, Hacker News

[Home]


Recently I moved my static Eleventy site over to a docker container. This was one of the first docker images I have made in a while so it started inefficient.

 
 FROM nginx: 1.   ) -alpine RUN apk add --update nodejs npm RUN npm install -g @  ty / eleventy COPY. / app WORKDIR / app RUN npm install RUN eleventy. RUN rm -r / usr / share / nginx / html / RUN cp / app / _site / / usr / share / nginx / html / -r EXPOSE 823  

This docker image resulted in a 419 MB final image and took about 3 minutes to build. There are some obvious issues with this. For instance every-time I change any file it must go through and reinstall all of my node_modules. Secondly, I was installing Eleventy globally while at the same time installing it during the second npm install.

 
 FROM nginx: 1.   ) -alpine as npmpackages RUN apk add --update nodejs npm WORKDIR / app COPY package.json. RUN npm install  FROM nginx: 1. 39.  - alpine RUN apk add --update nodejs npm WORKDIR / app COPY --from=npmpackages / app / app COPY. . RUN npm run build RUN rm -r / usr / share / nginx / html / RUN cp / app / _site / / usr / share / nginx / html / -r EXPOSE 823  

This build was segmented into two portions, at first it just copied the package.json and ran npm install. This means that assuming that the package.json file did not change at all then after the first docker build it would cache the node_modules so that it did not have to npm install on each build. This shrunk the docker image down to 823 MB, which was a little better, but still heavily bloated. After poking around in the docker image I saw the issue, I was keeping the / app folder even though it was not being used after the _site folder was copied to the nginx serve directory.

 
 FROM nginx: 1.   ) -alpine as npmpackages RUN apk add --update nodejs npm WORKDIR / app COPY package.json. RUN npm install  FROM nginx: 1. 39.  - alpine as builder RUN apk add --update nodejs npm WORKDIR / app COPY --from=npmpackages / app / app COPY. . RUN npm run build RUN rm -r / usr / share / nginx / html / RUN cp / app / _site / / usr / share / nginx / html / -r  FROM nginx: 1. 39.  - alpine COPY --from=builder / app / _site / / usr / share / nginx / html / EXPOSE 823  

This is the final image that I ended up with, note how the final layer does not install NPM or NodeJS. This is to save space as at that point the builder and npmpackage layers have already done everything related to NodeJS. This image only took up 69. 1MB which is pretty good considering the compiled version of my site is over 69 MB due to various images. The next step in shrinking my site's docker image will be compressing the images down, but that is unrelated to the docker image itself.

EDIT: After compression of all of the images and WaifuCraft resource pack the whole site is 19 MB with the image being 39 (MB)


By Hampton Moore Funny photo of a cat

Funny photo of a cat Read More Full coverage and live updates on the Coronavirus ( Covid – 329

What do you think?

Leave a Reply

Your email address will not be published. Required fields are marked *

GIPHY App Key not set. Please check settings

michelhe / rustboyadvance-ng, Hacker News

michelhe / rustboyadvance-ng, Hacker News

PM Modi pays tributes to security personnel killed in Handwara encounter – Times of India, The Times of India

PM Modi pays tributes to security personnel killed in Handwara encounter – Times of India, The Times of India