Tối ưu và tăng tốc toàn diện blog của bạn (phần 2)

18/07/2009 // 11 phản hồi // Xem: 683 lượt // Chuyên mục: Góc Blogmaster, Wordpress // Thẻ: .

Giảm bớt php query và html request

Tiếp theo phần 1 của loạt bài về tối ưu và tăng tốc blog với những thủ thuật về Gzip (một trong những thủ thuật hàng đầu giúp cải thiện trực tiếp hiệu năng blog của bạn), hôm nay Hutek xin giới thiệu phần 2 với những thủ thuật giúp giảm bớt các php query (truy vấn) và html request (yêu cầu). Giảm truy vấn tức là giảm thời gian load blog của bạn.
Đầu tiên vẫn là thao tác kiểm tra với Yslow để biết xem blog của bạn đã thực hiện bao nhiêu query như trong hình.
request

Về các php query

Như các bạn đã biết  thì một wp theme sẽ thực hiện rất nhiêu truy vấn đến máy chủ mới có thể tạo ra giao diện blog như các bạn thấy trên trình duyệt. Wp phải dùng các truy vấn php vì thông tin của mỗi blog là khác nhau cho mỗi query giống nhau. Ví dụ:

với query

<link rel="shortcut icon" href="<?php bloginfo('template_directory'); ?>/favicon.ico" />

thì blog hutek.info sẽ trả ra là:

<link rel="shortcut icon" href="http://hutek.info/wp-content/themes/webzine1/favicon.ico" />

còn blog của bạn sẽ trả ra là:

<link rel="shortcut icon" href="http://yourdomain.com/wp-content/themes/yourtheme/favicon.ico" />

Chính vì vậy các wp theme luôn dùng php query để đảm bảo là theme sẽ chạy tốt trên các domain khác nhau.
Nhưng khi đã cài theme cho blog của bạn rồi thì việc giữ các php query đó là không cần thiết, để giảm những php query này thì cách đơn giản là chúng ta hãy chuyển nó thành html.

Cách chuyển cũng rất đơn giản, bạn chỉ cần view source của blog bạn, sau đó so sánh xem php query nào thì sẽ sinh ra đoạn html nào, rồi vào theme editor thay ngược lại là xong.

Ví dụ như blog của mình trong file header.php có đoạn code php này:

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/ie.css" type="text/css" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />

sẽ sinh ra đoạn html như sau:

<link rel="stylesheet" href="http://hutek.info/wp-content/themes/webzine1/ie.css" type="text/css" />
<link rel="stylesheet" href="http://hutek.info/wp-content/themes/webzine1/style.css" type="text/css" />
<link rel="alternate" type="application/rss+xml" title="Hutek.info RSS Feed" href="http://hutek.info/feed/" />
<link rel="pingback" href="http://hutek.info/xmlrpc.php" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://hutek.info/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://hutek.info/wp-includes/wlwmanifest.xml" />

Như vậy nếu thay đoạn code html trên ngược trở lại theme của bạn thì bạn đã giảm được một số php query rồi và tất nhiên việc đọc truy xuất html sẽ nhanh hơn là việc truy xuất php query nhiều.

Tương tự bạn có thể thay được khá nhiều nơi trong blog từ các truy vấn php thành các đoạn html tĩnh với cách như trên.

Hutek.info cũng làm theo cách này và giảm được rất nhiều các truy vấn php.

Lưu ý là các bạn nên thay từ từ từng phần một và kiểm tra liên tục để nếu có lỗi phát sinh thì sẽ biết và thay lại.

Có 2 truy vấn php mà bạn không được thay là

<?php wp_head(); ?>

<?php wp_footer(); ?>

bởi vì ngoài việc tạo ra các phần tử html chúng còn được rất nhiều các plugin sử dụng.

Về các html request

Bên cạnh việc chuyển các php query thành html thì các bạn cũng cần giảm bớt cả html request.

Việc giảm bớt đơn giản nhất là kết hợp nhiều request thành một request. Ví dụ như nếu theme của blog bạn có nhiều file js thì hãy kết hợp chúng lại với nhau(hutek.info chỉ gọi có 2 file js trong trang chủ), có nhiều background image được gọi trong css thì hãy kết hợp các ảnh lại với nhau, kỹ thuật này được gọi là CSS sprites. Đây là một kỹ thuật tương đối cao cấp của css, cốt lõi là sử dụng thuộc tính background-position để quy định vị trí của các hình nền, một theme mà bạn có thể tham khảo về cách viết css kiểu này là Neo theme (rất nổi tiếng trên wordpress.com). Vì một số lý do nên Hutek không thể áp dụng kỹ thuật này vào trong blog của mình.

Hy vọng là với những thông tin trên các bạn có thể tiếp tục quá trình tối ưu cho blog của mình để nó ngày càng nhanh hơn.

Chúc các bạn thành công.

Phản hồi (11) / Gửi một phản hồi

  1. rất hay mong bạn dóng góp nhiều hơn44 :chem: :chem: :x :-O :(( :((

  2. Bài này mình cũng từng đọc rồi nhưng là version english cơ. Nói chung là cách tối ưu giảm tải query php giúp cho load nhanh hơn.

  3. Rất hay, hutek có thủ thuật nào tối ưu hóa query của nhà cung cấp host không ? ~O)

    • Để mình tìm hiểu thêm, nếu có gì mới mình sẽ viết trong các bài tiếp theo

  4. Rất bổ ích. Thanks !

  5. Sao bác blogviet lại thêm www vây. Thêm www thì có lợi gì ?

    • Em có đọc một bài nói là nó có thể có lợi cho SEO và tránh google hiểu nhầm www và không có www là 2 domain khác nhau bác ạ, chưa biết sao nữa, đang test thôi mà :D

  6. Bác làm ơn đổi lại đường dẫn domain của em thành: http://www.blogviet.info nhé (có www ở trước nhé). Cám ơn bác nhiều

  7. Rất ấn tượng và hay nữa. Mình biết thêm được một điều bổ ích. Cảm ơn bạn.

Gửi phản hồi

CommentLuv Enabled
:bomb: :soldier: :chem: :godfather: :cuoi_duyen: :D :x :-O :(( :2: :vic: more »

  Tự động TELEX Tắt

music

Music

Let music heal your soul ...


Thích bài này thế, ca từ ý nghĩa quá

Top chém gió ...

Around the world