新聞中心
docker鏡像瘦身:從1.43G到22.4MB
作者:張亞龍譯 2021-08-30 07:08:59
云計算 Docker 鏡像的大小對于系統(tǒng)的 CI/CD 等都有影響,尤其是云部署場景。我們在生產(chǎn)實踐中都會做瘦身的操作,盡最大的可能使用 Size 小的鏡像完成功能。

圖片來自 包圖網(wǎng)
下文是一個簡單的 ReactJS 程序上線的瘦身體驗,希望可以幫助大家找到鏡像瘦身的方向和靈感。
如果你正在做 Web 開發(fā)相關(guān)工作,那么你可能已經(jīng)知道容器化的概念,以及知道它強大的功能等等。
但在使用 Docker 時,鏡像大小至關(guān)重要。我們從 create-react-app (https://reactjs.org/docs/create-a-new-react-app.html)獲得的樣板項目通常都超過 1.43 GB。
今天,我們將容器化一個 ReactJS 應(yīng)用程序,并學習一些關(guān)于如何減少鏡像大小并提高性能的技巧。
我們將以 ReactJS 為例,但它適用于任何類型的 NodeJS 應(yīng)用程序。
步驟 1:創(chuàng)建項目
①借助腳手架通過命令行模式創(chuàng)建 React 項目:
- npx create-react-app docker-image-test
②命令執(zhí)行成功后將生成一個基礎(chǔ) React 應(yīng)用程序架構(gòu)。
③我們可以進入項目目錄安裝依賴并運行項目:
- cd docker-image-test
- yarn install
- yarn start
④通過訪問 http://localhost:3000 可以訪問已經(jīng)啟動的應(yīng)用程序。
步驟 2:構(gòu)建第一個鏡像
①在項目的根目錄中創(chuàng)建一個名為 Dockerfile 的文件,并粘貼以下代碼:
- FROM node:12
- WORKDIR /app
- COPY package.json ./
- RUN yarn install
- COPY . .
- EXPOSE 3000
- CMD ["yarn", "start"]
②注意,這里我們從 Docker 倉庫獲得基礎(chǔ)鏡像 Node:12,然后安裝依賴項并運行基本命令。(我們不會在這里討論 Docker 命令的細節(jié))
③現(xiàn)在可以通過終端為容器構(gòu)建鏡像:
- docker build -t docker-image-test .
④Docker 構(gòu)建鏡像完成之后,你可以使用此命令查看已經(jīng)構(gòu)建的鏡像:
- docker images
在查詢結(jié)果列表的頂部,是我們新創(chuàng)建的圖像,在最右邊,我們可以看到圖像的大小。目前是 1.43GB。
⑤我們使用以下命令運行鏡像:
- docker run --rm -it -p 3000:3000/tcp docker-image-test:latest
打開瀏覽器并且刷新頁面驗證其可以正常運行。
步驟 3:修改基礎(chǔ)鏡像
①先前的配置中我們用 node:12 作為基礎(chǔ)鏡像。但是傳統(tǒng)的 Node 鏡像是基于 Ubuntu 的,對于我們簡單的 React 應(yīng)用程序來說這大可不必。
②從 DockerHub(官方 Docker 鏡像注冊表)中我們可以看到,基于 alpine-based 的 Node 鏡像比基于 Ubuntu 的鏡像小得多,而且它們的依賴程度非常低。
③下面顯示了這些基本圖像的大小比較:
現(xiàn)在我們將使用node:12-alpine作為我們的基礎(chǔ)鏡像,看看會發(fā)生什么。
- FROM node:12-alpine
- WORKDIR /app
- COPY package.json ./
- RUN yarn install
- COPY . .
- EXPOSE 3000
- CMD ["yarn", "start"]
然后我們以此構(gòu)建我們的鏡像,并與之前做對比。
哇!我們的鏡像大小減少到只有 580MB,這是一個很大的進步。但還能做得更好嗎?
步驟 4:多級構(gòu)建
①在之前的配置中,我們會將所有源代碼也復(fù)制到工作目錄中。
②但這大可不必,因為從發(fā)布和運行來看我們只需要構(gòu)建好的運行目錄即可。因此,現(xiàn)在我們將引入多級構(gòu)建的概念,以減少不必要的代碼和依賴于我們的最終鏡像。
③配置是這樣的:
- # STAGE 1
- FROM node:12-alpine AS build
- WORKDIR /app
- COPY package.json ./
- RUN yarn install
- COPY . /app
- RUN yarn build
- # STAGE 2
- FROM node:12-alpine
- WORKDIR /app
- RUN npm install -g webserver.local
- COPY --from=build /app/build ./build
- EXPOSE 3000
- CMD webserver.local -d ./build
④在第一階段,安裝依賴項并構(gòu)建我們的項目。
⑤在第二階段,我們復(fù)制上一階段構(gòu)建產(chǎn)物目錄,并使用它來運行應(yīng)用程序。
⑥這樣我們在最終的鏡像中就不會有不必要的依賴和代碼。
接下來,構(gòu)建鏡像成功后并從列表中查看鏡像:
現(xiàn)在我們的鏡像大小只有 97.5MB。這簡直太棒了。
步驟 5:使用 Nginx
①我們正在使用 Node 服務(wù)器運行 ReactJS 應(yīng)用程序的靜態(tài)資源,但這不是靜態(tài)資源運行的最佳選擇。
②我們嘗試使用 Nginx 這類更高效、更輕量級的服務(wù)器來運行資源應(yīng)用程序,也可以盡可能提高其性能,并且減少鏡像的量。
③我們最終的 Docker 配置文件看起來像這樣:
- # STAGE 1
- FROM node:12-alpine AS build
- WORKDIR /app
- COPY package.json ./
- RUN yarn install
- COPY . /app
- RUN yarn build
- # STAGE 2
- FROM nginx:stable-alpine
- COPY --from=build /app/build /usr/share/nginx/html
- EXPOSE 80
- CMD ["nginx", "-g", "daemon off;"]
④我們正在改變 Docker 配置的第二階段,以使用 Nginx 來服務(wù)我們的應(yīng)用程序。
⑤然后使用當前配置構(gòu)建鏡像。
⑥鏡像大小減少到只有 22.4MB!
⑦同時,我們正在使用一個性能更好的服務(wù)器來服務(wù)我們出色的應(yīng)用程序。
⑧我們可以使用以下命令驗證應(yīng)用程序是否仍在工作。
- docker run --rm -it -p 3000:80/tcp docker-image-test:latest
⑨注意,我們將容器的 80 端口暴露給外部,因為默認情況下,Nginx 將在容器內(nèi)部的 80 端口上可用。
所以這些是一些簡單的技巧,你可以應(yīng)用到你的任何 NodeJS 項目,以大幅減少鏡像大小。
現(xiàn)在,您的容器確實更加便攜和高效了。今天就到這里。編碼快樂!
作者:張亞龍譯
編輯:陶家龍
出處:轉(zhuǎn)載自公眾號分布式實驗室(ID:dockerone)
出處:https://javascript.plainenglish.io/how-i-reduced-docker-image-size-from-1-43-gb-to-22-4-mb-84058d70574b
新聞名稱:Docker鏡像瘦身:從1.43G到22.4MB
文章地址:http://m.5511xx.com/article/ccdcods.html


咨詢
建站咨詢
