Tăng tốc Flatsome bằng cách loại bỏ css + js thừa.
Các bạn biết đấy theme Flatsome, wordpress , plugin càng ngày update càng ngày trở nên nặng nề.
Bạn có biết dùng Flatsome cho đa mục đích, thực tế sử dụng rất ít điều đó có nghĩa là hơn 90% là dư thừa mình chỉ dụng chưa đến 10%.
Ví dụ Flatsome trước khi tối ưu như cô gái bên trái còn đã tối ưu như cô gái bên phải. Theo bạn thì cô nào cạy nhanh hơn?
Trường hợp nếu bạn dùng plugin bật tính năng remove css unsed mà ko bị lỗi thì cứ sư dụng. Còn bị lỗi thì xóa thủ công.
Với cách làm cũ dùng Chrome DevTools để xóa css và js dư thừa. Bạn nên xem qua source của các trang khác nhau mình cứ đọc đi xem các class mình nó đã sử dụng. Sau khi đọc xong mình cũng nhớ phần nào các class đã sử dụng, để đến khi lúc xóa thì mình có nhớ sơ qua class này đã sử dụng ở trang nào( nó cũng giảm thời gian cho mình test đấy các bạn).
Trước khi làm cần lưu ý: backup , xóa hết cache và tắt hết tất cả cache. Tốt nhất là các bạn clone web sang 1 web khác rồi làm trên đó, Khi ok thì mới áp lên trang chính.
Cách làm:
-
Vào web bằng Chrome
-
Nhấn Ctrl + Shift +I
-
Click vào 3 chấm nhỏ góc trên phía bên phải chọn "More tool -->Coverage.
-
Nhấn refresh
-
Click vào file cần xóa css, js thừa nó sẽ hiện đoạn nào dùng màu xanh, đoạn nào không dùng màu đỏ.
-
Dựa vào đoạn màu đỏ mình tìm đến file cần xóa rồi chọn những dòng đó xóa đi.
Copy dòng đỏ nhấn Ctrl + F tìm cho nhanh
Lưu ý sau khi xóa thì cần test các trang khác, các trình duyệt và thiết bị khác nhau có bị lỗi hay ko?
Cách này làm dễ lỗi nên các bạn cẩn thận nhé.
Khi làm xong lợi ích của nó mang lại cũng đáng để làm đấy các bạn!
Ví dụ mình đã dùng tool này mình xóa, giờ web chạy rất nhẹ (shopcon.vn html + inline css +inline js ).
Test tốc độ thấy cũng ổn định hơn.
Kiên trì làm sẽ thành công!