+2

Hướng dẫn cách thêm liên kết CDN vào đoạn code HTML

CDN – Viết tắt của cụm từ Content Delivery Network hoặc Content Distribution Network. Theo Wikipedia, CDN là mạng lưới phân phối địa lý của các máy chủ proxy và trung tâm dữ liệu của chúng.

Mạng phân phối nội dung giúp cung cấp nội dung Internet mà không có bất kỳ sự chậm trễ nào. Nó giảm thiểu khoảng cách giữa máy chủ và người dùng.

Trong bài viết này, tôi sẽ chỉ cho bạn cách thêm liên kết CDN vào các dự án code HTML. Ví dụ, chúng tôi thêm liên kết CDN fontawesome vào bất kỳ trang web nào.

Cải thiện tốc độ mở trang web và hiệu suất cùng trải nghiệm người dùng tốt nhất cũng rất hữu ích.

Thêm liên kết CDN vào mã HTML

CDN hoạt động như thế nào?

CDN là mạng lưới các máy chủ được liên kết với nhau với mục tiêu đáp ứng yêu cầu của người dùng một cách nhanh chóng, an toàn và với chi phí thấp nhất có thể.

Khi người dùng tìm kiếm điều gì đó trên Google hoặc trình duyệt web, CDN sẽ giúp cung cấp dữ liệu từ máy chủ đến người dùng được kết nối với các IXP (điểm trao đổi Internet) với người dùng và máy chủ.

Nó cũng chứa một bản sao dữ liệu của máy chủ để cung cấp tốc độ cao.

Sự khác biệt giữa CDN và lưu trữ web?

CDN - Viết tắt của Content Delivery Network. Họ chịu trách nhiệm nâng cao hiệu suất của người dùng cuối bằng cách cải thiện tốc độ phân phối nội dung. Về cơ bản, họ làm việc để làm cho internet nhanh hơn.

Lưu trữ web - Đây là dịch vụ cho phép các tổ chức và cá nhân lưu trữ một trang web trên Internet để công chúng sử dụng. Nhà cung cấp dịch vụ lưu trữ web chịu trách nhiệm tạo điều kiện cho các công nghệ cần thiết để chạy một trang web để công chúng xem.

Làm thế nào để thêm liên kết CDN vào HTML?

Rất đơn giản, hầu hết các trang web đều cung cấp liên kết CDN trực tiếp, chỉ cần tìm kiếm trên trình duyệt web và sao chép liên kết CDN rồi dán vào mã tuyệt vời của bạn. Đây là một liên kết bạn cũng đặt trên trang web của mình.

<html lang="en">
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>How to add CDN links in HTML</title>
    <!-- FontAwesome Icons -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css"
    />
   <!-- Stylesheet -->
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>

  </body>
</html>

trong đoạn code này, chúng ta có thể thêm liên kết CDN fontawesome vào Mã HTML. Bạn có thể thêm vào CDN theo cách này chỉ cần sử dụng thẻ liên kết và dán vào href.

Phần kết luận

Tôi thực sự khuyên bạn nên sử dụng CDN Link trên trang web của mình vì nó giúp cải thiện thời gian tải trang web, giảm chi phí băng thông, tăng tính khả dụng và chất lượng của nội dung, đồng thời cải thiện tính bảo mật của trang web.

Cảm ơn các bạn đã đọc và theo dõi bài viết vừa rồi.


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí