Thông qua bài viết giới thiệu về Firebug, thì đối với người tìm hiểu và người làm thiết kế web chuẩn SEO cũng dễ tìm hiểu các thành phần khác. Vì vậy, tôi không giới thiệu thêm nhiều và sẽ gửi đến bạn các về ứng dụng của nó.
Trong bài viết này tôi sẽ nói về phần ứng dụng Firebug để tăng tốc độ website của bạn.
- Liên hệ công ty thiết kế web tại Biên Hòa Đồng Nai
Sử dụng ứng dụng Firebug để tăng tốc độ website của bạn.
Tab NET của Firebug cung cấp cho bạn các thông số loading của các thành phần website của bạn.
- Các status 200 (có response), 404 (can’t not found)….
- Thời gian load: thời gian cho một đối tượng load xuống browser.
- Dung lượng load: Phần này nếu như bạn nhìn thấy dấu ? và status 200 có nghĩa là có reponse nhưng là response sai kết quả.
- Thứ tự load: Phần này khá quan trọng và tôi sẽ trình bày tiếp theo sau đây.
Lý do cho phần 4 rất quan trọng vì các phần khác hầu như mọi người đều biết cách khắc phục mà không cần có nhiều kinh nghiệm.
1. Giả sử site của bạn bị status not found, bạn chỉ cần cập nhật lại link hoặc rời khỏi để tăng tốc độ trang web thay vì bắt browser phải search request lên server mất khá nhiều tời gian.
2. Về thời gian và dung lượng: nếu bạn muốn tăng tốc, bạn chỉ cần optimize hình, javascript, CSS cho dung lượng tối thiểu mà vẫn còn đầy đủ chức năng.
- Thông thường, nếu bạn sử dụng hình jpg, tôi thường đặt để resolution 60 hoặc 70 tùy theo chất lượng hình ảnh, cũng có thể tăng lên một chút, nếu bạn có kinh nghiệm về Photoshop sẽ biết phải làm gì với nó.
- javascript và CSS, để giảm kích thước dung lượng, sau khi code xong, bạn chỉ cần để tất cả chúng vào một dòng hoặc sử dụng các công cụ minify javascript hoặc minify css trước khi upload lên server.
3. Về mặt thứ tự, có thể một số người có kinh nghiệm và chú ý thì có thể biết, nhưng tôi nghĩ rằng hầu hết các nhà thiết kế website có thể không quan tâm đến điều này.
Trong thực tế, điều này rất quan trọng trong việc tăng tốc website của bạn. Bạn cũng thấy các thành phần được load theo hình bậc thang không đều. Các thành phần có điểm load bắt đầu bằng nhau thì có nghĩa là đang được load cùng một lúc. Các thành phần load sau và thụt vào có nghĩa là nó phải chờ thành phần trước.
- Thành phần GET Firebug-cong-cu-huu-ich… được load lên đầu tiên, điều này là hiển nhiên vì trang html của bạn luôn được gọi đầu tiên. Tất nhiên các thành phần sau phải chờ nó.
- Cũng vì vậy mà bạn thấy css_6 đã được load lên sau và thụt vào phía sau, nghĩa là phải chờ trang html load xong browser mới nhận biết được html đó gọi những file gì.
- Theo sau CSS là đến các hình ảnh được gọi từ tệp CSS. Nếu các bạn để ý kỹ thì sẽ thấy rằng khi kiểu file (đuôi file bị thay đổi) sẽ gây nên tình trạng chờ, tức bị thụt vào.
Vậy làm sao để tránh tình trạng bậc thang càng ít càng tốt? (Sử dụng ứng dụng Firebug để tăng tốc độ website của bạn.)
Thông qua mô tả ở trên, thì chắc các bạn đã có thể hiểu những gì các bạn cần làm.
- Khi sử dụng hình ảnh cho website nên giảm thiểu việc sử dụng nhiều kiểu file hình.
- Tận dụng tối đa CSS để đặt hình ảnh mà không cần gọi thuộc tính style của thẻ html.
- Theo lời khuyên của các chuyên gia Yahoo về tăng tốc website, nên đặt CSS lên hàng đầu và javascript ở phía dưới cùng
Về javascript, ngoại trừ trường hợp bất khả kháng, nó mới được đặt ở vị trí chính xác trong html. Bởi vì có một số trường hợp bạn đặt dưới cùng, bạn sẽ bị undefine các variable và function. Thông thường, javascript chỉ được gọi dựa trên sự kiện người dùng nên được đặt bên dưới, điều này làm cho người dùng trang web của bạn cảm thấy nhanh chóng. Trang web của bạn có thể bật lên nhanh chóng và javascript sẽ load ngầm sau đó. Thông thường, bạn có thể truy cập trang chủ citglobal.tech và refresh sau đó sẽ thấy giao diện load lên trước và sau đó load ngầm javascript.
Hoặc bạn có thể vào trang chủ sau đó nhấp vào bất kỳ chủ đề nào. Bạn sẽ chỉ thấy các thành phần khác nhau giữa các trang đã thay đổi. Nếu bạn refresh tại chỗ, thì hầu hết các trang web sẽ xuất hiện ngay lập tức mà không bị giật.
