Lưu trữ code cho website sử dụng GitHub phân phối qua CDN Staticaly

Trong bài viết Lưu trữ code cho website sử dụng GitHub phân phối qua CDN jsDelivr tôi đã giới thiệu cho bạn CDN là gì và lợi ích của nó mang lại, trong bài viết này ta sẽ cùng đi tìm hiểu cách lưu trữ code cho website sử dụng GitHub phân phối qua CDN Staticaly

Staticaly cũng hoạt động tương tự một số trang raw file GitHub như raw.githack.com, JsDelivr, gitCDN,... hỗ trợ raw file Github, Gitlab, Bitbucket. Ngoài ra Staticaly cũng hỗ trợ bạn tối ưu tốc độ load image mọi hosting qua CDN của nó (imgpx)

1. Raw File GitHub

Staticaly được sử dụng để chạy trên nhiều CDN như CloudFlare, Fastly, CDN77 và BunnyCDN nên thời gian phản hồi cực nhanh. Tương tự như các dịch vụ raw file khác nó cũng phân chia làm 2 dạng: URL cho sản phẩm và URL cho phát triển

- URL cho sản phẩm

• Không giới hạn lưu lượng truy cập. Các tệp được phân phát qua "Super Fast CDN"
• Tệp được lưu trữ vĩnh viễn dựa trên URL
• Thời gian cache lưu trữ trên trình duyệt - 1 năm.

URL theo Staticaly sử dụng short hash 8 ký tự. Ví dụ tôi có 1 file GitHub

https://github.com/PrismJS/prism/blob/master/prism.js và lần commit cuối cùng là 2ba62268

+ Với chế độ URL cho sản phẩm, liên kết được thay đổi như sau

https://cdn.staticaly.com/gh/PrismJS/prism/2ba62268/prism.js

+ Với chế độ URL cho phát triển, liên kết được thay đổi như sau

https://cdn.staticaly.com/gh/PrismJS/prism/2ba62268/prism.js?env=dev

---------------------

* Ngoài ra bạn có thể thay đổi mã hash thành master thì nó luôn lấy phiên bản cuối cùng ví dụ

+ Với chế độ URL cho sản phẩm

https://cdn.staticaly.com/gh/PrismJS/prism/master/prism.js

+ Với chế độ URL cho phát triển

https://cdn.staticaly.com/gh/PrismJS/prism/master/prism.js?env=dev

Thường thì file sẽ không cập nhật ngay lập tức, có khi bạn cần đợi một tối đa tới 24h nên khuyên bạn hãy làm việc với chế độ url dạng hash commit

Để sửa liên kết nhanh bạn hãy truy cập vào trang chủ https://www.staticaly.com/ dán url file GitHub vào và nhận lại link nhúng vào trang web

2. Imgpx

Đây là 1 tính năng nổi trội hơn của Staticaly, mọi image khi đi qua CDN của nó được tối ưu và cho hiệu năng tăng đáng kể

Cách làm đơn giản thôi ví dụ tôi có 1 link ảnh

https://i.imgur.com/8tqc6F5.jpg

chỉ cần sửa URL lại thành

https://cdn.staticaly.com/img/i.imgur.com/8tqc6F5.jpg

tức là bỏ đi https:/ hoặc http:/ và thêm đuôi được in đậm vào là có thể vắt qua Staticaly. So sánh hiệu năng thì ở ảnh trên đầu bài viết tôi đã trình bày cho bạn rồi

Tương tự truy cập https://www.staticaly.com/imgpx và dán link ảnh vào và nhận lại link nhúng

3. Cây nhà lá vườn

Chỉ là thấy vẫn còn thiếu thiếu nên viết lại 1 trang tổng hợp cho nhanh thôi. Truy cập https://hung1001.github.io/tools/staticaly.html dán file github vào và nhận lại các liên kết có thể giúp ích cho bạn

Như vậy qua bài viết này chúng ta lại có thêm 1 phương án nữa để sử dụng github làm hosting miễn phí cho website

Theo tôi đánh giá đây là 1 dịch vụ FREE rất tiềm năng và bạn nên sử dụng cho website của mình, bản thân blog của tôi cũng đang raw file qua CDN của nó

Chúc bạn thành công !