Chuyển nhà - Từ DigitalOcean sang Cloudflare Pages

Chuyển nhà - Từ DigitalOcean sang Cloudflare Pages

Vấn đề

Nếu quan tâm, có thể bạn biết tôi đang sử dụng DigitalOcean để lưu trữ trang blog này, với cấu hình khiêm tốn chỉ 1GB RAM, 20GB SSD là vừa đủ cho TechStack mà tôi lựa chọn. Gọi là vừa đủ bởi vì nó vẫn hoạt động tốt với lượng truy cập như hiện tại, chỉ có điều triển khai bằng Docker nên việc lưu trữ hình ảnh mà nó tạo ra đôi khi là một vấn đề lớn. Docker được mệnh danh là "sát thủ ổ cứng" khi bạn có nhiều Images, cộng với thiết lập CI/CD thì phải nói rằng "combo hủy diệt". Thử nghĩ 20GB ổ cứng, chưa trừ hệ điều hành thì sao mà có thể triển khai liên tục được cơ chứ. Thi thoảng, máy chủ báo ổ cứng bị đầy tôi lại phải vào để xóa bớt.

Tình cờ được biết đến Cloudflare Pages cung cấp giải pháp triển khai rất nhiều thể loại web, như Vue, React, Nuxt.js, Next.js… tôi có tò mò xem thử xem nó có gì. Nguyên một tuần trước là khoảng thời gian để nghiên cứu. Cuối cùng quyết định thử chuyển hai trang giao diện sang xem có được không.

Quá trình chuyển nhà

Theo Cloudflare, Cloudflare Pages là một nền tảng JAMstack dành cho các nhà phát triển giao diện người dùng và triển khai các trang web. Pages tập trung vào nhà phát triển khi nó cung cấp nhiều giải pháp như tích hợp Git để hỗ trợ khả năng triển khai liên tục (CI/CD), cũng như tốc độ triển khai và tốc độ của ứng dụng được triển khai thông qua nó.

Nhận thấy tiềm năng của Cloudflare, tôi có thể di chuyển hai trang Front-end là trang quản trị (AdminCP) & giao diện của trang Blog sang. AdminCP được viết bằng Vue.js sử dụng SPA, blog thì bằng Nuxt.js và dùng SSR. Đối với SPA thì lượng tài nguyên nó dùng không đáng là mấy, theo như tôi thấy chỉ chiếm vài MB bộ nhớ vì vốn dĩ nó được triển khai thông qua Nginx. Còn SSR thì chiếm kha khá bộ nhớ, phải nói là nhiều nhất trong số các service đang chạy. Đơn giản vì nó được triển khai thông qua máy chủ Node.js, mà Node thì tiêu tốn nhiều bộ nhớ. Cả Vue và Nuxt.js đều được Pages hỗ trợ, thế cho nên bước đầu hoàn toàn có thể di chuyển hai trang này sang. Nhưng trước khi chuyển, cần phải đánh giá lại tính năng cần chuyển.

Đầu tiên là trang quản trị, do viết bằng Vue và sử dụng SPA cho nên việc chuyển qua Pages không quá phức tạp, tất cả những gì cần làm là thay đổi biến môi trường để nó nhận cấu hình trong khi build.

Đến trang giao diện của Blog thì tôi chợt nảy ra ý tưởng: thay vì sử dụng SSR như hiện tại thì tại sao mình không thử chuyển nó thành SGG? Bằng cách này tôi có thể dùng lệnh tạo trang web thành các file HTML tĩnh rồi tải nó lên bất kì đâu hỗ trợ Static page không chỉ riêng Cloudflare Pages. Hơn nữa tốc độ sẽ nhanh hơn đáng kể so với SSR thông thường vì không cần phải truy vấn vào database và sinh mã HTML mỗi lần truy cập nữa. Nghĩ là làm, tôi đã dành nguyên một tuần trước để sửa lại mã Nuxt sao cho nó hoạt động tốt với chế độ SGG.

Cuối cùng, đầu tuần này tôi đã hoàn tất cơ bản việc di chuyển hai trang giao diện sang Pages. Tất nhiên là còn có một vài lỗi cần phải sửa nhưng hiện tại nó hoàn toàn đáp ứng được nhu cầu đọc và tìm kiếm của mọi người.

Lợi ích của việc chuyển nhà

Bỏ được một phần chi phí tài nguyên cho trang quản trị và trang giao diện của Blog, tuy rằng không nhiều nhưng giờ đây tôi không phải quá lo lắng khi máy chủ đột ngột quá tải hay một lỗi nào đó xảy ra, nó vẫn có thể hoạt động như bình thường do Cloudflare đã lưu trữ lại toàn bộ HTML.

Quy trình CI/CD được rút ngắn và đỡ phức tạp hơn khi trước đây tôi cần viết nhiều tập lệnh hỗ trợ việc này thông qua Gitlab CI và Docker thì giờ đây, bất kỳ lúc nào "đẩy" code lên gitlab, nó hoàn toàn có thể build một cách tự động.

Tôi đã chuyển DNS sang Cloudflare để tận dụng hạ tầng CDN cũng như cơ chế Cache dữ liệu của họ. Blog giờ đây có tốc độ truy cập rất ấn tượng.

Cuối cùng, có thể Web in the EDGE sẽ thành xu hương trong thời gian tới. Nghĩa là bạn không cần phải triển khai máy chủ cụ thể để chạy trang web nữa, mà chỉ cần chạy thông qua các dịch vụ như Pages. Để tìm hiểu thêm xu hướng này, bạn đọc có thể xem tại https://deno.com/blog/the-future-of-web-is-on-the-edge.

Những gì còn phải làm

Mặc dù quá trình chuyển đổi đa phần thuận lợi, tuy nhiên vẫn còn một số vấn đề cần thời gian để khắc phục.

Thứ nhất là các lỗi chưa phát hiện ra hoặc phát hiện ra rồi nhưng không quá ảnh hưởng đến trải nghiệm người dùng. Vấn đề này chỉ cần thời gian để khắc phục, hoặc nếu bạn đọc phát hiện ra lỗi, có thể để lại bình luận để thông báo cho tôi biết và sửa chúng.

Có một số tính năng sau khi chuyển sang Pages thì trở nên thừa hoặc bị vô hiệu hóa, việc cần làm là gỡ nó ra để tránh gây nhầm lẫn sau này.

Một vấn đề nữa là sau khi Pages deploy thành công hoặc thất bại, chưa có cách nào để kích hoạt lại một thông báo về cho mình biết. Hy vọng rằng Cloudflare sớm sẽ bổ sung thêm tính năng thông báo hoặc trước hết, tôi sẽ chạy một đoạn mã curl cùng với lệnh npm run generate để gửi thông báo về Telegram.

Đó là những gì trước mắt, xa hơn là loại bỏ hoàn toàn máy chủ, đưa tất cả dịch vụ lên đám mây. Khi đó tôi sẽ thiết lập được một hệ thống tự động và không cần phải lo lắng quá nhiều về hạ tầng nữa.

hoặc
* Bản tin tổng hợp được gửi mỗi 1-2 tuần, huỷ bất cứ lúc nào.
Author

Xin chào, tôi tên là Hoài - một anh Dev kể chuyện bằng cách viết ✍️ và làm sản phẩm 🚀. Với nhiều năm kinh nghiệm lập trình, tôi đã đóng góp một phần công sức cho nhiều sản phẩm mang lại giá trị cho người dùng tại nơi đang làm việc, cũng như cho chính bản thân. Sở thích của tôi là đọc, viết, nghiên cứu... Tôi tạo ra trang Blog này với sứ mệnh mang đến những bài viết chất lượng cho độc giả của 2coffee.dev.Hãy theo dõi tôi qua các kênh LinkedIn, Facebook, Instagram, Telegram.

Bạn thấy bài viết này có ích?
Không

Bình luận (1)

Avatar
Noi Truong10 tháng trước
Cho mình hỏi, khi bạn chuyển blog sang SSG thì blog có full static được không? các bài viết có được generate thành html tĩnh không hay vẫn phải chạy runtime rendering lại post mỗi khi có request mới?
Trả lời
Avatar
Xuân Hoài Tống10 tháng trước
Các bài viết của mình được generate thành các file .html luôn, đồng nghĩa với việc nó sinh ra hết nội dung của bài viết trong file đó luôn. Còn một vài phần cần dữ liệu động, như phần bình luận thì mình vẫn sử dụng JavaScript để tải như bình thường 😄