fanirifanto.com
Terbit pada
Blogging

Mempercepat Loading Blog dengan htaccess

Penulis

Masih tentang mempercepat loading blog atau website. Kali ini, kita bicara tentang bagaimana memanfaatkan file .htaccess untuk mempercepat loading blog atau website.

Apa itu .htaccess ?

.htaccess adalah file text sederhana (dalam format ascii). Pada umumnya kita bisa menggunakan file .htaccess untuk merubah beberapa konfigurasi untuk mengarahkan pada web server Apache. File .htaccess dapat ditaruh di manapun pada folder website anda. Namun, letak paling ideal adalah pada root website atau blog kita (public_html). Sebuah file yang dibuat khusus untuk membuat sebuah tugas tertentu dengan permisi khusus, yang bersifat server side. Jadi ini tidak terlihat dari sisi pengguna. File ini akan membantu memudahkan kita mengatur link, redirect, permisi halaman, termasuk mempercepat loading.

Menggunakan .htaccess untuk mempercepat loading blog

Mengaktifkan Gzip compression

Pada blog self hosted seperti blog dengan HTMLy atau Wordpress, gzip compression secara default tidak aktif. Kecuali Anda menggunakan shared hosting seperti Hawkhost atau Namecheap. Untuk mengaktifkan Gzip compression, silahkan buka file .htaccess Anda dengan text editor yang Anda miliki. Saya biasanya menggunakan notepad++. Selanjutnya, tambahkan kode berikut di sana.

# Enable Gzip compression.
<IfModule mod_deflate.c>

    # Force compression for mangled headers.
    # http://developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping
    <IfModule mod_setenvif.c>
        <IfModule mod_headers.c>
            SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)s*,?s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
            RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
        </IfModule>
    </IfModule>

    # Compress all output labeled with one of the following MIME-types
    # (for Apache versions below 2.3.7, you don't need to enable `mod_filter`
    #  and can remove the `<IfModule mod_filter.c>` and `</IfModule>` lines
    #  as `AddOutputFilterByType` is still in the core directives).
    AddOutputFilterByType DEFLATE application/atom+xml 
                                  text/js 
                                  text/javascript 
                                  application/javascript 
                                  application/x-javascript 
                                  application/json 
                                  application/rss+xml 
                                  application/vnd.ms-fontobject 
                                  application/x-font-ttf 
                                  application/x-web-app-manifest+json 
                                  application/xhtml+xml 
                                  application/xml 
                                  font/opentype 
                                  image/svg+xml 
                                  image/x-icon 
                                  text/css 
                                  text/html 
                                  text/plain 
                                  text/x-component 
                                  text/xml

</IfModule>

Kode ini adalah kode yang saya ambil dari HTMLy. Secara default, kalau Anda menggunakan HTMLy, gzip compression ini sudah aktif.

Kalau Anda menggunakan Wordpress, taruh kode ini di baris bawah sendiri pada file .htaccess. Simpan file tersebut.

Untuk mengecek apakah gzip compression telah aktif, gunakan page speed tool dari Patrick Sexton di sini. Akan ada notifikasi apakah sudah aktif atau belum.

Mengaktifkan Expires header

Ini mengontrol setting expires untuk file-file tertentu. Misal gambar, audio, video, favicon, dll. Dalam hal ini, control Cache blog juga harus aktif. Untuk HTMLy, kode dari setting ini sudah ada di file .htaccess. Hanya tinggal uncomment untuk mengaktifkannya. Cache control di HTMLy dapat diatur melalui halaman konfgurasi blog di dashboard admin. Sementara, kalau Anda menggunakan Wordpress, Cache harus Anda deklarasikan di halaman wp-config. Letaknya bisa di atas detail database blog Wordpress Anda. Tambahkan kode berikut ini :

define ('WP_CACHE', true);

Bisa juga ditambahkan setelah kode <?php. Dengan catatan, Anda tidak menggunakan plugin cache seperti WP Super Cache atau W3 Total Cache. Setelah itu, baru masukkan kode expires header berikut ini di .htaccess

# Requires mod_expires to be enabled.
<IfModule mod_expires.c>

  # to activate mode_expires
   ExpiresActive on

  # ExpiresDefault                                      "access plus 1 month"

  # For CSS
  # ExpiresByType text/css                              "access plus 1 month"

  # For Data interchange
  # ExpiresByType application/json                      "access plus 0 seconds"
  # ExpiresByType application/xml                       "access plus 0 seconds"
  # ExpiresByType text/xml                              "access plus 0 seconds"

  # For Favicon
  # ExpiresByType image/x-icon                          "access plus 1 year"

  # For HTML components (HTCs)
  # ExpiresByType text/x-component                      "access plus 1 month"

  # For HTML
  # ExpiresByType text/html                             "access plus 1 month"

  # For JavaScript
  # ExpiresByType text/js                               "access plus 1 month"
  # ExpiresByType text/javascript                       "access plus 1 month"
  # ExpiresByType application/javascript                "access plus 1 month"
  # ExpiresByType application/x-javascript              "access plus 1 month"

  # For Manifest files
  # ExpiresByType application/x-web-app-manifest+json   "access plus 0 seconds"
  # ExpiresByType text/cache-manifest                   "access plus 0 seconds"

  # For Media
  # ExpiresByType audio/ogg                             "access plus 1 month"
  # ExpiresByType image/gif                             "access plus 1 month"
  # ExpiresByType image/jpeg                            "access plus 1 month"
  # ExpiresByType image/png                             "access plus 1 month"
  # ExpiresByType video/mp4                             "access plus 1 month"
  # ExpiresByType video/ogg                             "access plus 1 month"
  # ExpiresByType video/webm                            "access plus 1 month"

  # For Web feeds
  # ExpiresByType application/atom+xml                  "access plus 1 day"
  # ExpiresByType application/rss+xml                   "access plus 1 day"

  # For Web fonts
  # ExpiresByType application/font-woff                 "access plus 1 month"
  # ExpiresByType application/vnd.ms-fontobject         "access plus 1 month"
  # ExpiresByType application/x-font-ttf                "access plus 1 month"
  # ExpiresByType font/opentype                         "access plus 1 month"
  # ExpiresByType image/svg+xml                         "access plus 1 month"

</IfModule>

Uncomment pada masing-masing baris yang memiliki value. Simpan file ini.

Itulah cara mempercepat loading blog dengan htaccess. Anda dapat melihat bahwa di HTMLy, semua sudah disediakan oleh developer. Big thanks to Danlogs ... yang mengembangkan platform ini. Kalau Anda belum mengetahui apa itu HTMLy, silahkan explore di blog ini. Sebuah platform blogging asli Indonesia. Tanpa menggunakan database dan berbasis PHP.