Kita smua tau kan ,, nobody like SLOW WEBSITE ,, huh? sampe2 Robot pun males ketemu website lemot,, apalagi orang hehehe

Materi nya ,, :
- YSLOW & Pagespeed : disini penjelasannya -->
https://github.com/marcelduran/yslow/wiki
https://developers.google.com/speed/pagespeed/
Apa yg terpenting ? ini yg menurut ane paling penting :
No. 1 -> Minimize HTTP Requests
yang saya ketahui disini Default theme OC mempunyai 8 external Javascript scripts, 5 external stylesheets
No. 2 -> Leverage browser caching & Expire Header,, jadi next load nya bakal using cache
No. 3 -> Gzip Compression / Deflate ( kalo tersedia )
Info Tools Online untuk mengukur seberapa cepat Load Website yg kamu punya :
Tutorial dari bro @screenager8
Hasil Test ane (perhatian! ini sy punya pake oc.1.5.4.1 yah) ada tambahan? biar ane post di awal2 sini1. .htaccess dari HTML5Boilerplate (http://html5boilerplate.com/). Ini yg harus pertama dilakukan, krn mengubah skor PageSpeed dari 34 menjadi 87!!!
2. CSS Sprite untuk image2 yg sering dipakai, seperti yg ada di folder /themes/default/images/
3. Ganti image menjadi DataUrl. Lihat pro-cons-nya, krn DataUrl tidak support IE7 ke bawah.
4. Semua image harus punya atribut HEIGHT & WIDTH. ada bbrp image Opencart yg gak ada, jadi harus utak-atik kode.
==> disini cara nya http://forum.opencart.com/viewtopic.php?f=121&t=20057
5. Compress semua image pakai Lossless, contoh pakai JPEGMini (http://www.jpegmini.com/). Problemnya, sewaktu Opencart resize image tsb, hasilnya tidak dikompresi dengan baik.
6. Gabung semua Javascript & CSS. Musti hati2 untuk combine JS dan CSS terutama mengenai uturannya. Hasilnya kalau bisa hanya 1 javascript dan 1 css. Banyak file javascript yg tidak dipakai tetapi ada di folder.
7. Minify Javascript & CSS. Kalau bisa pakai aplikasi, tetapi bisa jg pakai Google Minify (http://code.google.com/p/minify/).
8. GZIP Compression. Pastikan web hostingnya menyalakan modul ini.

Code: Select all
.htaccess ane tanpa Gzip ,, karena host gk support deflate :(
==============================================================
# Proper MIME type for all files
# JavaScript
AddType application/javascript js jsonp
AddType application/json json
# Audio
AddType audio/mp4 m4a f4a f4b
AddType audio/ogg oga ogg
# Video
AddType video/mp4 mp4 m4v f4v f4p
AddType video/ogg ogv
AddType video/webm webm
AddType video/x-flv flv
# SVG
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
# Webfonts
AddType application/vnd.ms-fontobject eot
AddType application/x-font-ttf ttf ttc
AddType application/x-font-woff woff
AddType font/opentype otf
# Assorted types
AddType application/octet-stream safariextz
AddType application/x-chrome-extension crx
AddType application/x-opera-extension oex
AddType application/x-shockwave-flash swf
AddType application/x-web-app-manifest+json webapp
AddType application/x-xpinstall xpi
AddType application/xml rss atom xml rdf
AddType image/webp webp
AddType image/x-icon ico
AddType image/icon png
AddType text/cache-manifest appcache manifest
AddType text/vtt vtt
AddType text/x-component htc
AddType text/x-vcard vcf
<IfModule mod_headers.c>
Header set Connection Keep-Alive
Header append Vary Accept-Encoding
</IfModule>
FileETag MTime Size
Options +FollowSymlinks
Options -Indexes
<FilesMatch "\.(tpl|ini|log)">
Order deny,allow
Deny from all
</FilesMatch>
RewriteEngine On
RewriteBase /
RewriteRule ^sitemap.xml$ index.php?route=feed/google_sitemap [L]
RewriteRule ^googlebase.xml$ index.php?route=feed/google_base [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !.*\.(ico|gif|jpg|jpeg|png|js|css)
RewriteRule ^([^?]*) index.php?_route_=$1 [L,QSA]
# Redirect non www to www
RewriteCond %{HTTP_HOST} ^[^.]+\.[^.]+$
RewriteCond %{HTTPS}s ^on(s)|
RewriteRule ^ http%1://www.%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest "access plus 0 seconds"
# Your document html
ExpiresByType text/html "access plus 0 seconds"
# Data
ExpiresByType application/json "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType text/xml "access plus 0 seconds"
# Feed
ExpiresByType application/atom+xml "access plus 1 hour"
ExpiresByType application/rss+xml "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon "access plus 1 year"
ExpiresByType image/icon "access plus 1 year"
# Media: images, video, audio
ExpiresByType audio/ogg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/ogg "access plus 1 year"
ExpiresByType video/webm "access plus 1 year"
# HTC files (css3pie)
ExpiresByType text/x-component "access plus 1 year"
# Webfonts
ExpiresByType application/x-font-ttf "access plus 1 year"
ExpiresByType application/x-font-woff "access plus 1 year"
ExpiresByType font/opentype "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
# CSS and JavaScript
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType application/x-javascript "access plus 1 year"
ExpiresByType text/css "access plus 1 year"
</IfModule>
==============================================================
