사이트 속도 향상시키기 - Brotli Compression(WordPress등등)

시작하기 전에 사이트 속도를 먼저 측정해보자.

https://developers.google.com/speed/pagespeed/insights/

앞으로 할 포스팅에서 차차 개선해갈꺼다.. 일부러 낮춘거다.,.(이사하기전에 iptime DDNS로 호스팅 했을때는 빨랐는데.. 지금 인터넷이 느린걸수도..)

하는 이유 요약

압축은 더 적은 비트를 사용하여 정보를 인코딩하는 프로세스
불필요한 데이터를 제거하면 항상 최상의 결과가 도출.

기존에는 gzip 으로 하고있었는데 압축률이 더좋은 brotli로 바꾸는 과정이다.

**수정 2019-10-30

https://github.com/pothi/nginx-brotli 참고 원클릭 설치.

스크립트를 돌려서 쉽게 설치하자.(버전에 맞게 설치됨)

vi brolii.sh

#!/usr/bin/env bash

# version 1.2

# use it while developing / testing.
# you may use it in production as well.
# set -o errexit -o pipefail -o noclobber -o nounset
# set -x

# compile Nginx from the official repo with brotli compression

[ ! -d ${HOME}/log ] && mkdir ${HOME}/log

G_DIR="$(pwd)"

# logging everything
log_file=${HOME}/log/brotli.log
exec > >(tee -a ${log_file} )
exec 2> >(tee -a ${log_file} >&2)

# Defining return code check function
check_result() {
    if [ $1 -ne 0 ]; then
        echo "Error: $2"
        exit $1
    fi
}

export DEBIAN_FRONTEND=noninteractive

printf '%-72s' "Updating apt repos..."
sudo apt-get -qq update
echo done.

printf '%-72s' "Installing pre-requisites..."
sudo apt-get -qq install dpkg-dev build-essential zlib1g-dev libpcre3 libpcre3-dev unzip
echo done.

codename=$(lsb_release -c -s)

# function to add the official Nginx.org repo
nginx_repo_add() {
    distro=$(gawk -F= '/^ID=/{print $2}' /etc/os-release)
    if [ "$codename" == "juno" ] ; then
        codename=bionic
    fi

    if [ "$distro" == "elementary" ] ; then
        distro=ubuntu
    fi

    if [ "$distro" == "linuxmint" ] ; then
        distro=ubuntu
    fi

    [ -f nginx_signing.key ] && rm nginx_signing.key
    curl -LSsO http://nginx.org/keys/nginx_signing.key
    check_result $? 'Nginx key could not be downloaded!'
    sudo apt-key add nginx_signing.key &> /dev/null
    check_result $? 'Nginx key could not be added!'
    rm nginx_signing.key

    # for updated info, please see https://nginx.org/en/linux_packages.html#stable
    nginx_branch= # leave this empty to install stable version
    # or nginx_branch="mainline"

    if [ "$nginx_branch" == 'mainline' ]; then
        nginx_src_url="https://nginx.org/packages/mainline/${distro}/"
    else
        nginx_src_url="https://nginx.org/packages/${distro}/"
    fi

    [ -f /etc/apt/sources.list.d/nginx.list ] && sudo rm /etc/apt/sources.list.d/nginx.list
    echo "deb ${nginx_src_url} ${codename} nginx" | sudo tee /etc/apt/sources.list.d/nginx.list
    echo "deb-src ${nginx_src_url} ${codename} nginx" | sudo tee -a /etc/apt/sources.list.d/nginx.list

    # finally update the local apt cache
    sudo apt-get update -qq
    check_result $? 'Something went wrong while updating apt repos.'
}

case "$codename" in
    "stretch")
        nginx_repo_add
        ;;
    "xenial")
        nginx_repo_add
        ;;
    "bionic")
        nginx_repo_add
        ;;
    "juno")
        codename=bionic
        nginx_repo_add
        ;;
     "tara")
        codename=bionic
        nginx_repo_add
        ;;
    *)
        echo "Distro: $codename"
        echo 'Warning: Could not figure out the distribution codename. Continuing to install Nginx from the OS.'
        ;;
esac

sudo install -o ${UID} -g $(id -gn $USER) -d /usr/local/src/${USER}
cd /usr/local/src/${USER}
apt-get source nginx
sudo apt-get build-dep nginx -y

git clone --recursive https://github.com/eustas/ngx_brotli
sudo ln -s /usr/local/src/${USER}/ngx_brotli /usr/local/src/ngx_brotli
sudo chown ${USER}:$USER:$(id -gn $USER) /usr/local/src/ngx_brotli
cd /usr/local/src/${USER}/nginx-*/

# modify the existing config
sed -i -e '/\.\/configure/ s:$: --add-module=/usr/local/src/ngx_brotli:' debian/rules

# if gcc 8 is installed add patch to nginx 
if [ "$(gcc -dumpversion)" == "8" ]; then
    mkdir -p debian/patches
    cp ${G_DIR}/gcc-8_fix.diff debian/patches/gcc-8_fix
    echo "gcc-8_fix" > debian/patches/series
fi

# build the updated pacakge
dpkg-buildpackage -b

# optional
# install the updated package in the current server
cd /usr/local/src/${USER}

# take a backup
[ ! -d ~/backups/ ] && mkdir ~/backups
cp nginx*.deb ~/backups/nginx-$(date +%F)/

# sudo apt-mark unhold nginx
sudo dpkg -i nginx_*.deb

# print info about remove all the sources and apt sources file
cd ~/

printf "
# To clean up after install You can run
 rm -rf /usr/local/src/$(echo ${USER})/nginx*
 rm -rf /usr/local/src/$(echo ${USER})/ngx_brotli
 sudo rm /etc/apt/sources.list.d/nginx.list
 sudo apt-get -qq update
"
# hold the package nginx from updating accidentally in the future by someone else!
sudo apt-mark hold nginx

# stop the previously running instance, if any
sudo nginx -t && sudo systemctl stop nginx

# start the new Nginx instance
sudo nginx -t && sudo systemctl start nginx

그리고 실행권한 부여 후 실행

chmod +x brotli.sh
bash britli.sh

이제 /etc/nginx/nginx.conf에 아래와같이 설정을 집어넣자 http{ 안에

#brotli 셋팅 #dynamic mode brotli on; # 다이나믹 on brotli_comp_level 6; # 압축레벨 설정 brotli_types text/plain text/css application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript image/x-icon image/vnd.microsoft.icon image/bmp image/svg+xml; # 압축 타입 ex js,이미지 등등 #static mode brotli_static on; # static 모드 on

설치후 curl로 적용됐나 확인해보자.

curl -H “Accept-Encoding: br” -I 192.168.X.X

Web 서버에 들어가서 작업할꺼니까 ssh 콘솔을 띄우자.

그리고 nginx 버전 확인
nginx -t

wget http://nginx.org/download/nginx-1.14.0.tar.gz gzip -d nginx-1.14.0.tar.gz tar xvf nginx-1.14.0.tar

이제 git에서 nginx 용 brolit를 받자
*참고 git 안깔려있으면 apt install git으로 git먼저 설치
https://github.com/google/ngx_brotli

ngx_brotli 다운로드

apt install git
git clone https://github.com/google/ngx_brotli.git;

git submodule update

cd ngx_brotligit submodule update --init

nginx에 모듈 추가

./configure –add-dynamic-module=/home/admin-sv/brotli/ngx_brotli –with-compat

make modules;

언제나 Configure > make 순이다~ (make 명령어가 없으면 apt git make)

C컴파일러가 없다고 나오면?

https://blog.dalso.org/linux/1273/configure-error-c-compiler-cc-is-not-found-configure-%ec%98%a4%eb%a5%98%eb%b0%9c%ec%83%9d/

참고

https://blog.dalso.org/linux/1279/configure-error-the-http-rewrite-module-requires-the-pcre-library-you-can-either-disable-the-module-by-using-without-http_rewrite_module-option-or-install-the-pcre-library-into-the-system-or/

이걸루.

https://blog.dalso.org/linux/1291/configure-error-the-http-gzip-module-requires-the-zlib-library-you-can-either-disable-the-module-by-using-without-http_gzip_module-option-or-install-the-zlib-library-into-the-system-or-build/

이걸루 설치..