↓ Skip to main content
BisaCloud Docs
  1. Posts/

Enable Google PageSpeed Module

·8 mins·
Linux Linux Apache Nginx
Table of Contents

Modul PageSpeed dirancang untuk mengoptimalkan kinerja server web dengan mempercepat response time, mempercepat proses pemuatan halaman, serta menghemat penggunaan bandwidth.

Google PageSpeed adalah modul open-source yang dikembangkan oleh Google, dan dapat digunakan pada web server seperti Apache dan Nginx.

Build Instructions (Nginx)
#

1. Download ngx_pagespeed
#

Gunakan script berikut untuk mengunduh ngx_pagespeed:

NPS_VERSION=1.13.35.2-stable
cd
wget -O- https://github.com/apache/incubator-pagespeed-ngx/archive/v${NPS_VERSION}.tar.gz | tar -xz
nps_dir=$(find . -name "*pagespeed-ngx-${NPS_VERSION}" -type d)
cd "$nps_dir"

NPS_RELEASE_NUMBER=${NPS_VERSION/beta/}
NPS_RELEASE_NUMBER=${NPS_VERSION/stable/}

psol_url=https://dl.google.com/dl/page-speed/psol/${NPS_RELEASE_NUMBER}.tar.gz
[ -e scripts/format_binary_url.sh ] && psol_url=$(scripts/format_binary_url.sh PSOL_BINARY_URL)

wget -O- ${psol_url} | tar -xz  # extracts to psol/

Cek versi terbaru PageSpeed melalui release note: https://www.modpagespeed.com/doc/release_notes

2. Download source code Nginx
#

Pastikan Anda mengunduh source code Nginx sesuai dengan versi Nginx yang saat ini digunakan.

wget https://nginx.org/download/nginx-1.24.0.tar.gz
tar -xaf nginx-1.24.0.tar.gz

3. Pindahkan folder PageSpeed
#

Pindahkan folder incubator-pagespeed-ngx-1.13.35.2-stable ke dalam direktori Nginx.

mv incubator-pagespeed-ngx-1.13.35.2-stable nginx-1.24.0/ngx_pagespeed

4. Compile modul PageSpeed
# 

cd nginx-1.24.0
./configure --with-compat --add-dynamic-module=ngx_pagespeed
make modules

Jika muncul error saat compile seperti berikut.

ngx_pagespeed/src/ngx_pagespeed.cc:407:36: error: request for member ‘elts’ ...
ngx_pagespeed/src/ngx_pagespeed.cc:408:35: error: cannot convert ‘ngx_table_elt_t**’ ...

Lakukan patch file ngx_pagespeed.cc.

mv ngx_pagespeed/src/ngx_pagespeed.cc{,.bkp} -v
curl -s https://raw.githubusercontent.com/apache/incubator-pagespeed-ngx/master/src/ngx_pagespeed.cc > ngx_pagespeed/src/ngx_pagespeed.cc

Kemudian ulangi proses compile.

6. Install modul yang sudah dikompilasi
#

Copy file modul ke direktori modules Nginx:

cp objs/ngx_pagespeed.so /etc/nginx/modules/

7. Load module di konfigurasi Nginx
#

Buat file konfigurasi module:

nano /etc/nginx/modules.conf.d/pagespeed.conf

Isi dengan:

load_module "modules/ngx_pagespeed.so";

PageSpeed Configuration (Nginx)
#

1. Buat file konfigurasi pagespeed.conf
# 

nano /etc/nginx/conf.d/pagespeed.conf

Isi file dengan:

# =========================================================
#                 BASIC SETTINGS
# =========================================================
pagespeed on;
pagespeed FileCachePath "/var/cache/ngx_pagespeed";
pagespeed CreateSharedMemoryMetadataCache "/var/cache/ngx_pagespeed/shm" 8192;

# =========================================================
#                     REWRITE LEVEL
# =========================================================
# CoreFilters menyediakan optimasi aman untuk kebanyakan CMS (termasuk WordPress).
pagespeed RewriteLevel CoreFilters;

# Filter tambahan yang aman (opsional):
# pagespeed EnableFilters rewrite_css,rewrite_images,rewrite_javascript,extend_cache;
# pagespeed EnableFilters combine_css,combine_javascript;  # Hati-hati, bisa menyebabkan error plugin
# pagespeed DisableFilters add_instrumentation;            # Nonaktifkan jika tidak membutuhkan instrumentation

# =========================================================
#               IN-PLACE RESOURCE OPTIMIZATION
# =========================================================
pagespeed InPlaceResourceOptimization on;

# =========================================================
#              CACHE & PERFORMANCE TUNING
# =========================================================
pagespeed MessageBufferSize 200000;
pagespeed FetcherTimeoutMs 10000;
pagespeed NativeFetcherMaxKeepaliveRequests 50;
pagespeed UseNativeFetcher on;

# =========================================================
#                   STATISTICS
# =========================================================
pagespeed Statistics on;
pagespeed StatisticsPath /ngx_pagespeed_statistics;
pagespeed GlobalStatisticsPath /ngx_pagespeed_global_statistics;
pagespeed ConsolePath /pagespeed_console;
pagespeed MessagesPath /ngx_pagespeed_message;
pagespeed AdminPath /pagespeed_admin;
pagespeed GlobalAdminPath /pagespeed_global_admin;

# Batasi akses ke endpoint statistik (sangat direkomendasikan)
location ~ ^/(ngx_pagespeed_statistics|ngx_pagespeed_global_statistics|pagespeed_console|ngx_pagespeed_message|pagespeed_admin|pagespeed_global_admin) {
    allow 127.0.0.1;
    allow ::1;
    deny all;
}

# =========================================================
#                  IMAGE OPTIMIZATION
# =========================================================
pagespeed CriticalImagesBeaconEnabled false;
pagespeed EnableFilters recompress_images,convert_jpeg_to_progressive;
pagespeed JpegRecompressionQuality 75;
pagespeed WebpRecompressionQuality 70;

# =========================================================
#            SAFE FILTERS (WordPress)
# =========================================================
# Pastikan header caching tetap konsisten.
pagespeed ModifyCachingHeaders on;

# Disable filter yang sering bermasalah pada WordPress:
pagespeed DisableFilters add_instrumentation;
pagespeed DisableFilters outline_css;
pagespeed DisableFilters outline_javascript;
pagespeed DisableFilters move_css_to_head;

# =========================================================
#                    PROXY MAPPING (OPSIONAL)
# =========================================================
# Contoh jika ingin mengoptimasi resource dari domain eksternal.
# pagespeed MapProxyDomain http://your-domain.com/static/ http://cdn.eksternal.com/;

# =========================================================
#           VARIABEL SCRIPT (JIKA DIBUTUHKAN)
# =========================================================
pagespeed ProcessScriptVariables all;

2. Tambahkan script pagespeed_libraries_generator.sh
#

Buat file:

nano pagespeed_libraries_generator.sh

Isi dengan:

URL="https://github.com/apache/incubator-pagespeed-mod/raw/master/"
URL+="net/instaweb/genfiles/conf/pagespeed_libraries.conf"

curl -L -s -S "$URL" \
    | grep ModPagespeedLibrary \
    | while read library size hash url; do
  echo "  pagespeed Library $size $hash $url;"
done

Beri permission eksekusi:

chmod +x pagespeed_libraries_generator.sh

3. Generate file pagespeed_libraries.conf
# 

./pagespeed_libraries_generator.sh > /etc/nginx/conf.d/pagespeed_libraries.conf

4. Restart Nginx
# 

systemctl restart nginx

Build Instructions (Apache)
#

1. Download modul PageSpeed
#

Unduh paket prebuilt mod_pagespeed:

wget https://github.com/apache/incubator-pagespeed-mod/releases/download/1.9.32.10/1.9.32.10-stable-shared_obj.tar.gz
Versi 1.9.32.10 adalah versi stabil terakhir untuk distribusi shared object (tanpa compile). Untuk versi lebih baru, harus compile from source.

2. Extract paket modul
# 

tar -xaf 1.9.32.10-stable-shared_obj.tar.gz

3. Pilih modul sesuai OS & versi Apache
#

Masuk ke folder stable_so:

cd stable_so

Contoh: untuk CentOS dan Apache 2.4, gunakan:

cp centos64_libmod_pagespeed_ap24.so /usr/lib64/httpd/modules/mod_pagespeed.so

Path umum untuk lokasi modul Apache:

Distro Path Modul
CentOS / RHEL / Rocky /usr/lib64/httpd/modules/
Ubuntu / Debian /usr/lib/apache2/modules/

Jika Anda menggunakan Ubuntu/Debian:

cp ubuntu64_libmod_pagespeed_ap24.so /usr/lib/apache2/modules/mod_pagespeed.so

4. Load module di Apache
#

Edit file konfigurasi Apache:

  • CentOS/RHEL: /etc/httpd/conf.modules.d/pagespeed.conf
  • Debian/Ubuntu: /etc/apache2/mods-available/pagespeed.load

Masukkan:

LoadModule pagespeed_module modules/mod_pagespeed.so

Jika path modul berada di direktori berbeda (Ubuntu):

LoadModule pagespeed_module /usr/lib/apache2/modules/mod_pagespeed.so

5. Restart Apache
# 

systemctl restart httpd   # CentOS/RHEL
systemctl restart apache2 # Debian/Ubuntu

PageSpeed Configuration (Apache)
#

1. Buat file konfigurasi
# 

nano /etc/httpd/conf.d/pagespeed.conf

Isi file dengan:

<IfModule pagespeed_module>

    # ============================================================
    #                       BASIC SETTINGS
    # ============================================================
    ModPagespeed on
    # AddOutputFilterByType MOD_PAGESPEED_OUTPUT_FILTER text/html
    # ModPagespeedLogDir "/var/log/pagespeed"

    # ============================================================
    #                        CACHE SETTINGS
    # ============================================================
    ModPagespeedFileCachePath "/var/cache/mod_pagespeed/"
    ModPagespeedFileCacheSizeKb 1024000
    ModPagespeedFileCacheCleanIntervalMs 3600000
    ModPagespeedFileCacheInodeLimit 100000

    # Shared memory metadata cache
    ModPagespeedCreateSharedMemoryMetadataCache "/var/cache/mod_pagespeed/shm/" 8192
    ModPagespeedDefaultSharedMemoryCacheKB 8192
    ModPagespeedCompressMetadataCache on

    # ============================================================
    #                       REWRITE LEVEL
    # ============================================================
    ModPagespeedRewriteLevel CoreFilters

    # ============================================================
    #                  SAFE FILTERS (WordPress)
    # ============================================================
    ModPagespeedEnableFilters lazyload_images,convert_jpeg_to_webp
    ModPagespeedEnableFilters resize_images,resize_mobile_images
    ModPagespeedEnableFilters inline_preview_images,recompress_images
    ModPagespeedEnableFilters rewrite_css,rewrite_javascript
    ModPagespeedEnableFilters collapse_whitespace,remove_comments
    ModPagespeedEnableFilters extend_cache,insert_dns_prefetch
    ModPagespeedEnableFilters prioritize_critical_css

    # Disable filter yang rawan menyebabkan error
    ModPagespeedDisableFilters combine_css,combine_javascript
    ModPagespeedDisableFilters inline_css,inline_javascript
    ModPagespeedDisableFilters flatten_css_imports

    # ============================================================
    #                   IMAGE OPTIMIZATION
    # ============================================================
    ModPagespeedJpegRecompressionQuality 80
    ModPagespeedWebpRecompressionQuality 80
    ModPagespeedImageRecompressionQuality 80
    ModPagespeedImageLimitOptimizedPercent 95
    ModPagespeedImageLimitResizeAreaPercent 95
    ModPagespeedImageInlineMaxBytes 2048
    ModPagespeedCssImageInlineMaxBytes 2048
    ModPagespeedCriticalImagesBeaconEnabled on

    # ============================================================
    #                    CSS & JS SETTINGS
    # ============================================================
    ModPagespeedCssInlineMaxBytes 2048
    ModPagespeedJsInlineMaxBytes 2048
    ModPagespeedCssOutlineMinBytes 3000
    ModPagespeedJsOutlineMinBytes 3000

    # ============================================================
    #                       CACHING RULES
    # ============================================================
    ModPagespeedModifyCachingHeaders on
    ModPagespeedXHeaderValue off

    # ============================================================
    #                IN-PLACE RESOURCE OPTIMIZATION
    # ============================================================
    ModPagespeedInPlaceResourceOptimization on
    ModPagespeedInPlaceRewriteDeadlineMs 5000
    ModPagespeedInPlaceWaitForOptimized off

    # ============================================================
    #                      COMPATIBILITY
    # ============================================================
    ModPagespeedRespectVary on
    ModPagespeedFetchHttps enable

    # ============================================================
    #                     PERFORMANCE TUNING
    # ============================================================
    ModPagespeedNumRewriteThreads 4
    ModPagespeedNumExpensiveRewriteThreads 2
    ModPagespeedFetcherTimeOutMs 10000
    ModPagespeedLazyloadImagesAfterOnload off

    # ============================================================
    #                           STATISTICS
    # ============================================================
    ModPagespeedStatisticsLogging on

    <Location /mod_pagespeed_statistics>
        Require ip 127.0.0.1 ::1
        SetHandler mod_pagespeed_statistics
    </Location>

    <Location /pagespeed_console>
        Require ip 127.0.0.1 ::1
        SetHandler pagespeed_console
    </Location>

    ModPagespeedMessageBufferSize 100000

    <Location /mod_pagespeed_message>
        Require ip 127.0.0.1 ::1
        SetHandler mod_pagespeed_message
    </Location>

</IfModule>


# ============================================================
#                       STATIC CACHE RULE
# ============================================================
<IfModule headers_module>
    <FilesMatch "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+">
        Header set Cache-Control "max-age=31536000, public"
        Header set X-Content-Type-Options "nosniff"
    </FilesMatch>
</IfModule>

2. Download pagespeed_libraries.conf
# 

wget -O /etc/httpd/conf.d/pagespeed_libraries.conf \
https://raw.githubusercontent.com/apache/incubator-pagespeed-mod/refs/heads/master/net/instaweb/genfiles/conf/pagespeed_libraries.conf

3. Restart Apache
# 

systemctl restart httpd

PageSpeed Best-Practice
#

WordPress
#

Konfigurasi fokus pada safe filters, menghindari kombinasi file, modifikasi DOM yang agresif, dan filter yang sering menyebabkan konflik plugin.

Image

Image

  1. Nginx:
# ===========================================
#               WORDPRESS BEST PRACTICE
# ===========================================

pagespeed on;
pagespeed FileCachePath "/var/cache/ngx_pagespeed";

# Optimasi aman untuk WordPress
pagespeed RewriteLevel CoreFilters;

# Filter tambahan yang aman (opsional)
pagespeed EnableFilters rewrite_css,rewrite_images,rewrite_javascript,extend_cache;

# Hindari filter yang sering menyebabkan error
pagespeed DisableFilters combine_css;
pagespeed DisableFilters combine_javascript;
pagespeed DisableFilters move_css_to_head;
pagespeed DisableFilters outline_css;
pagespeed DisableFilters outline_javascript;
pagespeed DisableFilters defer_javascript; 
pagespeed DisableFilters add_instrumentation;

# Optimasi gambar
pagespeed EnableFilters recompress_images,convert_jpeg_to_progressive;
pagespeed JpegRecompressionQuality 75;
pagespeed WebpRecompressionQuality 70;

# Perbaiki caching pada WordPress
pagespeed ModifyCachingHeaders on;

# In-place optimization
pagespeed InPlaceResourceOptimization on;

# Hindari critical beacon (WordPress tidak butuh)
pagespeed CriticalImagesBeaconEnabled false;

# Performance tuning
pagespeed UseNativeFetcher on;
pagespeed FetcherTimeoutMs 10000;
pagespeed MessageBufferSize 200000;

# Protect admin/console
location ~ ^/(pagespeed|ngx_pagespeed) {
    allow 127.0.0.1;
    deny all;
}
  1. Apache
# ===========================================
#           WORDPRESS BEST PRACTICE
# ===========================================

ModPageSpeed on
ModPageSpeedFileCachePath "/var/cache/mod_pagespeed"

# Core optimizations
ModPagespeedRewriteLevel CoreFilters

# Tambahan filter aman
ModPageSpeedEnableFilters rewrite_css,rewrite_javascript,rewrite_images,extend_cache

# Disable filter yang sering bermasalah pada WordPress
ModPageSpeedDisableFilters combine_css
ModPageSpeedDisableFilters combine_javascript
ModPageSpeedDisableFilters move_css_to_head
ModPageSpeedDisableFilters outline_css
ModPageSpeedDisableFilters outline_javascript
ModPageSpeedDisableFilters defer_javascript
ModPageSpeedDisableFilters add_instrumentation

# Optimasi gambar
ModPageSpeedEnableFilters convert_jpeg_to_progressive,recompress_images
ModPageSpeedJpegRecompressionQuality 75
ModPageSpeedWebpRecompressionQuality 70

# Perbaikan caching
ModPageSpeedModifyCachingHeaders on

# In-place optimization
ModPageSpeedInPlaceResourceOptimization on

# Beacon tidak diperlukan di WordPress
ModPageSpeedCriticalImagesBeaconEnabled off

# Performance tuning
ModPageSpeedMessageBufferSize 200000
ModPageSpeedFetcherTimeoutMs 10000

# Lindungi halaman admin PageSpeed
<Location /pagespeed_admin>
    Require local
</Location>
<Location /pagespeed_global_admin>
    Require local
</Location>

Laravel / PHP Framework
#

Laravel menghasilkan HTML server-rendered, sehingga bisa memanfaatkan optimasi lebih agresif (combine files, js minification, dll) tanpa risiko besar.

Image

Image

  1. Nginx
# ===========================================
#        LARAVEL / PHP FRAMEWORK BEST PRACTICE
# ===========================================

pagespeed on;
pagespeed FileCachePath "/var/cache/ngx_pagespeed";

# Optimasi tingkat agresif (aman untuk Laravel)
pagespeed RewriteLevel CoreFilters;
pagespeed EnableFilters combine_css,combine_javascript,inline_css,inline_javascript;
pagespeed EnableFilters rewrite_images,rewrite_javascript,rewrite_css;
pagespeed EnableFilters defer_javascript,lazyload_images,convert_jpeg_to_progressive;
pagespeed EnableFilters extend_cache,remove_quotes,collapse_whitespace;

# In-place optimization
pagespeed InPlaceResourceOptimization on;

# Cache tuning
pagespeed ModifyCachingHeaders on;

# Gambar
pagespeed WebpRecompressionQuality 70;
pagespeed JpegRecompressionQuality 75;

# Performance tuning
pagespeed FetcherTimeoutMs 10000;
pagespeed UseNativeFetcher on;
pagespeed NativeFetcherMaxKeepaliveRequests 50;

# Statistik (matikan jika tidak dibutuhkan)
pagespeed Statistics off;

# Protect admin
location ~ ^/(pagespeed|ngx_pagespeed) {
    allow 127.0.0.1;
    deny all;
}
  1. Apache
# ===========================================
#       LARAVEL / PHP FRAMEWORK BEST PRACTICE
# ===========================================

ModPageSpeed on
ModPageSpeedFileCachePath "/var/cache/mod_pagespeed"

# Optimasi agresif namun aman untuk Laravel
ModPagespeedRewriteLevel CoreFilters
ModPageSpeedEnableFilters combine_css,combine_javascript
ModPageSpeedEnableFilters inline_css,inline_javascript
ModPageSpeedEnableFilters rewrite_images,image_optimize
ModPageSpeedEnableFilters extend_cache,collapse_whitespace
ModPageSpeedEnableFilters defer_javascript,lazyload_images

# In-place optimization
ModPageSpeedInPlaceResourceOptimization on

# Optimasi gambar
ModPageSpeedJpegRecompressionQuality 75
ModPageSpeedWebpRecompressionQuality 70

# Performance tuning
ModPageSpeedFetcherTimeoutMs 10000
ModPageSpeedUseNativeFetcher on

# Disable statistik
ModPageSpeedStatistics off

# Admin protection
<Location /pagespeed_admin>
    Require local
</Location>
<Location /pagespeed_global_admin>
    Require local
</Location>

Static Site (HTML statis, blog statis, dokumentasi)
#

Untuk situs statis, PageSpeed bisa digunakan secara maksimal, termasuk combining + minification agresif, dan inline resource.

Image

Image

  1. Nginx
# ===========================================
#                STATIC SITE BEST PRACTICE
# ===========================================

pagespeed on;
pagespeed FileCachePath "/var/cache/ngx_pagespeed";

# Optimasi maksimum (aman untuk situs statis)
pagespeed RewriteLevel CoreFilters;
pagespeed EnableFilters combine_css,combine_javascript;
pagespeed EnableFilters rewrite_images,image_optimize,image_rewrite_identifiers;
pagespeed EnableFilters inline_css,inline_javascript;
pagespeed EnableFilters lazyload_images,extend_cache,defer_javascript;
pagespeed EnableFilters strip_image_color_profile,strip_image_meta_data;
pagespeed EnableFilters remove_comments,remove_quotes,collapse_whitespace;

# Gambar sangat optimal
pagespeed WebpRecompressionQuality 60;
pagespeed JpegRecompressionQuality 70;

# In-place optimization aktif
pagespeed InPlaceResourceOptimization on;

# Lebih agresif caching
pagespeed ModifyCachingHeaders on;

# Performance tuning
pagespeed FetcherTimeoutMs 15000;
pagespeed UseNativeFetcher on;

# Disable statistik (biasanya tidak perlu)
pagespeed Statistics off;

# Admin protection
location ~ ^/(pagespeed|ngx_pagespeed) {
    allow 127.0.0.1;
    deny all;
}
  1. Apache
# ===========================================
#             STATIC SITE BEST PRACTICE
# ===========================================

ModPageSpeed on
ModPageSpeedFileCachePath "/var/cache/mod_pagespeed"

# Optimasi maksimal untuk HTML statis
ModPagespeedRewriteLevel CoreFilters
ModPageSpeedEnableFilters combine_css,combine_javascript
ModPageSpeedEnableFilters rewrite_images,image_optimize
ModPageSpeedEnableFilters inline_css,inline_javascript
ModPageSpeedEnableFilters lazyload_images,extend_cache,defer_javascript
ModPageSpeedEnableFilters remove_comments,collapse_whitespace
ModPageSpeedEnableFilters strip_image_color_profile,strip_image_meta_data

# Optimasi gambar maksimal
ModPageSpeedJpegRecompressionQuality 70
ModPageSpeedWebpRecompressionQuality 60

# Caching agresif
ModPageSpeedModifyCachingHeaders on

# In-place optimization aktif
ModPageSpeedInPlaceResourceOptimization on

# Performance tuning
ModPageSpeedFetcherTimeoutMs 15000

# Statistik tidak diperlukan
ModPageSpeedStatistics off

# Admin protection
<Location /pagespeed_admin>
    Require local
</Location>
<Location /pagespeed_global_admin>
    Require local
</Location>

Related