BLOG

nginxでWEBサーバー立てるなら、しておくべきこと

| SERVER

テレビを見てて、チョーびっくりロック様がsiriと何かをするらしい!
ロック様というと、僕からしたら大スターです。アメリカのプロレス団体WWEの大スターです。
海外のプロレスにハマっていた時のトップの方でした。すぐに映画とかに出るようになってしまい、がっかりしたことを覚えています。

さて、本編ですが、自分のサイトを作る上で改めて考えさせられたことですが、サイトの表示速度です。
PageSpeed Insightsというツールを使いながら高得点を目指しております。
そこで、いままでフロントエンドエンジニアとしては、いろいろと施策はしておりましたが、今回はサーバも自分でやっているので色々と対策をしておりました。
その中で圧縮を有効にするというもの、これはいままで、apacheを使っていたので.htaccessで対応してましたが、今回はnginxをつかっているので、.htaccessでは出来ないらしい。ってか、.htaccessが使えないもんらしいです。
ってことで、どうするかというと、直接、設定ファイルに書き込む!
/etc/nginx/nginx.conf
上記設定ファイルに下記のようにすると完了ということです。

    #gzip on;
    ↓ // コメントアウトを外す。
    gzip  on;

    // 書きを追加する。
    gzip_types text/css application/javascript text/xml text/plain application/json application/rss+xml application/xhtml+xml application/postscript application/rtf application/pdf application/atom+xml application/x-perl text/x-component image/svg+xml;

圧縮を有効にするためにとりあえず、gzip onを追加、もともとコメントアウトされて記述されているのでコメントアウトこれにより圧縮をすることが可能になります。
gzip_typesで圧縮するファイルタイプを指定することで、圧縮をすることになるようです。
これにより「PageSpeed Insights」で圧縮を有効にするという項目が適用済みの最適化の項目に移動されます。
これで、結構なポイントが上がりました。
コード追加してnginxを再起動するだけで、表示速度が上がるようです。
体感的にはそこまでわかりませんでしたが、チリツモです。VPSでもしnginxを使ってらっしゃる方は、やっておいたほうがいいと思います。
ではでは、またー

RECENT POSTS

「reduce」を使って配列を値を処理する

data属性の取得・設定・更新【JavaScript】

変数のタイプを調べる、変換する 【Javascript】

VS CodeでLive Serverを使ってプレビューのリロードをしてみよう

メディアクエリでhoverが使えるデバイスかどうか

markdown-wasmというすごく高速なMarkdownパーサー

SNSシェアボタンをオリジナルで設置する

CSSでマスクする

クリッカブルマップのレスポンシブ対応ができる「image-map-resizer」が優秀らしい

我が家の植物たち

CATEGORY

POPULAR POSTS

PAGE TOP