WordPress Playground: WordPress chạy hoàn toàn trong trình duyệt

 (developer.wordpress.org)
5 điểm bởi GN⁺ 2023-07-15 | 1 bình luận | Chia sẻ qua WhatsApp
  • WordPress Playground là một công cụ trực tuyến để thử nghiệm và học WordPress mà không cần cài đặt; trang này không phải là website sản phẩm mà đóng vai trò trung tâm tài liệu chính thức
  • Tài liệu được chia thành Documentation, Blueprints, Developers và API Reference, lần lượt hướng dẫn cách bắt đầu, cấu hình dựa trên JSON, tích hợp với mã và tham chiếu API
  • Người dùng có thể dựng một site WordPress mới trong vòng 5 phút và thử các block, theme, plugin hoặc kiểm thử một phiên bản WordPress/PHP cụ thể
  • Nhà phát triển có thể chọn cách phù hợp với mục đích trong số Query API, Blueprints API, JavaScript API, và có thể dùng Playground như một môi trường phát triển cục bộ không cần cấu hình
  • Chạy bên trong sandbox của trình duyệt và ít phụ thuộc vào backend/xác thực, nên phù hợp cho demo nhanh, prototype và môi trường thử nghiệm do AI tạo ra

Trung tâm tài liệu WordPress Playground

  • Website Playground chính thức đã chuyển sang wordpress.org/playground/, còn trang này được dùng làm điểm vào tài liệu
  • WordPress Playground là một công cụ trực tuyến để thử nghiệm và học WordPress
  • Tài liệu gồm bốn trung tâm
    • Documentation: giới thiệu WordPress Playground, hướng dẫn bắt đầu, điểm vào tài liệu
    • Blueprints: tài liệu về file JSON dùng để cấu hình instance Playground
    • Developers: cách sử dụng Playground từ mã
    • API Reference: tham chiếu đầy đủ các API mà WordPress Playground cung cấp

Bắt đầu và luồng phát triển

  • Người dùng lần đầu có thể bắt đầu nhanh với việc tạo site WordPress mới, kiểm thử block/theme/plugin và kiểm thử phiên bản WordPress/PHP cụ thể trong Quick Start Guide
  • Playground web instance đề cập đến instance Playground được cung cấp tại https://playground.wordpress.net/
  • Trong About Playground, bạn có thể xem tính an toàn, cách sử dụng và các hạn chế hiện tại của Playground
    • Qua các tài liệu Build, Test, Launch, có thể xem luồng sử dụng Playground cho phát triển, kiểm chứng và ra mắt sản phẩm
  • Guides là tài liệu tập hợp hướng dẫn từng bước và cách sử dụng, còn Links and resources là bộ sưu tập tài nguyên liên quan

Bước đầu và lựa chọn API

Đóng góp và sử dụng AI

  • WordPress Playground là một dự án mã nguồn mở và tiếp nhận đóng góp về mã, thiết kế, tài liệu và triage
  • Playground được thiết kế để dùng cùng AI coding agent và các công cụ dựa trên AI
    • Chạy hoàn toàn phía client trên WebAssembly, không cần xác thực hay backend, và không để lại tác dụng phụ lâu dài bên ngoài sandbox của trình duyệt
    • Using Playground with AI agents: trong Claude Code, Cursor, Gemini CLI, GitHub Copilot, v.v., có thể cài đặt skill wp-playground để giao việc thực thi lệnh
    • AI-readable site index: bản tóm tắt llms.txt mà máy có thể đọc về các tính năng, API và tài liệu của Playground
    • AGENTS.md: hướng dẫn dành cho AI coding agent đóng góp vào codebase này
  • WordPress Playground là phần mềm tự do theo các điều khoản của GNU General Public License version 2 hoặc các phiên bản sau; giấy phép đầy đủ có trong LICENSE.md

Bài viết liên quan

1 bình luận

 
GN⁺ 2023-07-15
Ý kiến trên Hacker News

  • Thử trên Firefox của một máy tính bảng Android giá rẻ thì phản hồi không hẳn là tức thì, nhưng cũng không khác mấy so với việc chạy toàn bộ stack LAMP trên một cloud instance hay VPS tạm ổn, điều đó khá đáng ngạc nhiên
    Trong đó có cả trình thông dịch PHP đầy đủ, hàng nghìn dòng code của WordPress, và cả SQLite. Vậy mà vẫn đủ dùng được, thật ấn tượng

    • Tôi luôn cảm thấy hiệu năng của WordPress không khác biệt quá nhiều giữa phần cứng yếu và mạnh. Có vẻ như bản thân WordPress mới là nút thắt cổ chai

  • Cách họ làm cho thứ này chạy được rất hiện đại: PHP chạy dưới dạng binary WebAssembly, MySQL được thay bằng SQLite thông qua plugin WordPress, còn web server được triển khai bằng Service Worker của JavaScript

  • Trong câu “Playground hỗ trợ ứng dụng ghi chú cho thiết bị di động, môi trường kiểm thử tự động, và cả demo WooCommerce chạy ngay trên trang web”, hai ý sau thì hoàn toàn hợp lý, nhưng ý tưởng làm một ứng dụng di động dựa trên WordPress chạy PHP bằng WebAssembly ngay trong trình duyệt thì thật sự khiến tôi choáng váng

  • WordPress khiến cộng đồng HN chia rẽ mạnh. Một bên xem WordPress là công cụ khuếch đại giá trị giúp người không phải lập trình viên tập trung vào công việc chính mà không phải bận tâm đến code, bên còn lại thì ghét nó vì codebase lộn xộn và lại bám vào thứ code siêu mở rộng, định dạng hoàn hảo mà thực tế gần như chẳng ai dùng
    WordPress vận hành hơn một nửa web. Nó có thể không phải công nghệ tốt nhất, cũng có thể là tệ nhất, nhưng bài học mà nhiều lập trình viên cứ bỏ lỡ là không ai quan tâm xúc xích được làm ra như thế nào

    • Khi làm những website tiện ích nhỏ như cho một ban nhạc, tôi hoàn toàn đồng ý với điều đó. Chỉ cần quăng nó lên hosting giá rẻ và hy vọng ban nhạc tan rã trước khi tích hợp Google Calendar bị hỏng là đủ
      Tuy vậy, vì tôi đang trì hoãn việc chuyển SSO bên thứ ba từ một site WordPress cũ nát sang một site WordPress mới nát không kém, nên cũng xin trút bầu tâm sự rằng thật ra có tồn tại nhóm thứ ba chuyên bảo trì để nhóm đầu tiên không cần quan tâm xúc xích được làm ra thế nào.
      Tôi đã làm kiểu việc này khoảng 14 năm, đang host cỡ 300 site WordPress cho một trường đại học quy mô trung bình, từng xây và duy trì cả site .gov, và do định hướng của đội Gutenberg nên cũng đã làm khá nhiều block dựa trên React theo 3 mẫu rất khác nhau. Tôi đã làm mọi thứ từ triển khai server, sửa CSS cho IE6, cào dữ liệu từ những CMS không còn tồn tại để chuyển hàng nghìn trang và hàng chục nghìn ảnh sang WordPress, viết lệnh WP-CLI, cho đến code ép các sự kiện lịch lan truyền qua multisite.
      Phải có người biết xúc xích được làm ra như thế nào, và tôi là người biết. Vì vậy tôi cũng biết WordPress là một đống rác mong manh đến mức nào. Tôi từng làm với những codebase thực sự hữu ích hơn, có công cụ tốt hơn và cơ sở dữ liệu dễ hiểu hơn; tôi cũng biết nền tảng khác cũng có vấn đề, nhưng WordPress thực sự rất tệ.
      Vì thế tôi chửi nó không chút ngại ngần. Tôi kiệt sức hoàn toàn, đến mức chỉ muốn bỏ hết, ra sống trên xe tải và làm nhạc. Đây là một nền tảng tồi tệ, và người ta cũng chẳng trả tiền xứng đáng cho việc giữ cho nó tiếp tục chạy. Cuối cùng vẫn có những người vì hoàn cảnh mà cứ phải quay lại với WordPress như quay lại một tòa nhà đang cháy, và sự ác cảm tập thể với nền tảng này là hoàn toàn có cơ sở
    • WordPress rất tuyệt cho nhóm đầu tiên đã nói ở trên. Tôi xem nó giống như Excel, FileMaker hay Visual Basic, những công cụ đã dân chủ hóa phần mềm và giúp mọi người đều có thể tiếp cận
      Dĩ nhiên các công cụ như vậy đều có giới hạn và vấn đề chất lượng, và một số người dùng rốt cuộc sẽ phải đối mặt với chúng. Bản thân điều đó không sao cả. Vấn đề phát sinh khi người ta kỳ vọng chuyên gia phải tích hợp hoặc xây dựng trên đó. Những người tìm đến nhà phát triển web thường mang theo kỳ vọng về chất lượng, các vấn đề riêng và yêu cầu cụ thể, nhưng di sản WordPress đặt ra quá nhiều cạm bẫy và trở ngại trước những mục tiêu ấy, khiến nhiều trường hợp giống như cố nhét chốt vuông vào lỗ tròn. Điều tương tự cũng có thể nói về nhiều nền tảng CRM hay thương mại điện tử phổ biến
    • Tôi nghĩ mình là một kỹ sư phần mềm nghiêm túc, nhưng vẫn dùng WordPress cho website công ty
    • Có thể vấn đề không hẳn là bỏ đi để theo đuổi “đoạn code được định dạng hoàn hảo và siêu mở rộng”, mà là ngừng làm việc trên codebase không hoàn hảo hiện tại để bắt đầu một dự án mới sẽ hoàn hảo
    • Sự chia rẽ này có vẻ gần với khác biệt giữa thế hệ lập trình viên JavaScript full-stack mới và những người trưởng thành với PHP + MySQL hơn

  • Trong bài keynote State of the Word tháng 12/2022, họ định dành phần khá lớn để nói về thứ này: https://wordpress.tv/2023/01/04/matt-mullenweg-state-of-the-...
    Với tư cách kỹ sư, thấy nó thực sự chạy được và nghĩ đến mọi tầng cần phải tương tác để làm điều đó thì khá sốc. 6 tháng sau lại thấy nó thành chủ đề nóng trên HN cũng thú vị

    • Tôi rất hứng thú với việc chạy trong trình duyệt những thứ từ trước đến nay vẫn được xem là ứng dụng “phía máy chủ”. Đặc biệt càng thú vị hơn vì đây có vẻ là trường hợp đầu tiên chạy SQLite trong sản phẩm thực tế, trước giờ tôi chỉ thấy các demo kiểu đồ chơi
      Xem qua code một chút thì tôi cũng nhận ra hiện tại mình gần như không biết gì về PHP, và có vẻ nó không dùng cách tiếp cận SQLite-over-OPFS “truyền thống” cho tính bền vững dữ liệu. Đọc thêm thì vẫn chưa rõ lưu trữ bền vững thông qua Emscripten hiện đã khả thi hay chưa. Cuối cùng tôi tìm thấy https://github.com/WordPress/wordpress-playground/issues/19, nhưng có vẻ điều đó có nghĩa là WordPress trong trình duyệt hiện vẫn chưa thể có tính bền vững dữ liệu, khá đáng tiếc
    • Phần trình bày rất hay. Ai tò mò thì Wordpress Playground được giới thiệu từ 48:33

  • Hỏi thuần vì tò mò thôi: nếu tạm gác cơ sở dữ liệu sang một bên, có phải điều này có nghĩa là có thể chạy WordPress trên Cloudflare Worker không? https://developers.cloudflare.com/workers/runtime-apis/webas...

  • Tôi thường dùng WordPress cho nhiều site gần như tĩnh. Nó rất hợp để người không chuyên kỹ thuật tiếp tục thêm nội dung, và cho mục đích này thì gần như không có lựa chọn thay thế nào thật sự tiệm cận WordPress
    Tuy vậy, cần chọn plugin thật cẩn thận, thiết lập frontend Cloudflare phù hợp, và ngăn người dùng làm những việc trông có vẻ đơn giản nhưng thực ra nguy hiểm. Tôi có cảm giác phần lớn sự ghét WordPress đến từ việc hoặc là đã dùng nó từ rất lâu trước đây, hoặc có những nhu cầu mà WordPress không đáp ứng được, hoặc bị buộc phải gánh hệ thống legacy

    • Với tôi thì là trường hợp thứ hai và thứ ba, cộng thêm vài dự án mà headless CMS + code tùy biến rõ ràng tốt hơn nhiều nhưng khách hàng vẫn khăng khăng đòi WordPress
      Thực ra đó không phải lỗi của WordPress, nhưng điều đó không làm thay đổi cảm giác hơi co rúm vì sợ hãi mỗi khi chỉ nghe đến cái tên này

  • Việc chạy PHP trên WASM trong Playground này phản hồi nhanh hơn rất nhiều so với 95% website thông thường

    • Điểm tuyệt nhất ở đây là nó cắt giảm một lượng khổng lồ các vòng trao đổi với máy chủ. Mọi lời gọi cơ sở dữ liệu và yêu cầu tài nguyên đều diễn ra ở phía client. Tất nhiên đổi lại là phải chấp nhận thời gian tải vài giây
      WordPress có lẽ là giải pháp ứng dụng nhiều trang được dùng nhiều nhất, còn cách này về cơ bản biến nó thành ứng dụng một trang. Hơn nữa, vì không cần liên tục gửi API request về máy chủ nên hiệu năng của nó còn tốt hơn phần lớn ứng dụng một trang.
      Các phần kiểu ứng dụng một trang như trình chỉnh sửa bài viết/trang và trình chỉnh sửa site vốn là các ứng dụng React phức tạp, nhưng trong demo này lại cho cảm giác nhanh hơn cả môi trường phát triển cục bộ. Nó cho thấy ứng dụng một trang có thể tốt đến mức nào khi loại bỏ được các vòng trao đổi với máy chủ. Nhân tiện, tôi làm ở Automattic và theo dõi thử nghiệm này thực sự rất tuyệt vời.

  • Không cần phải dìm WordPress, nhưng nó có lịch sử lâu đời và cũng lắm vấn đề. Sẽ thật tốt nếu có một lựa chọn tự host hiện đại có thể dùng mà không cần trình tạo site tĩnh hay hosting phức tạp

    • Bất kỳ đối thủ nào cũng phải vượt qua một bài toán con gà và quả trứng cực kỳ khắc nghiệt. WordPress có plugin làm được gần như mọi thứ, lại thường có thể mua hỗ trợ trả phí nên rất khó tránh.
      Codebase thì không tốt, phát triển trên đó rất khổ sở, và cách thiết kế cùng việc quản lý store chính thức cũng không ngăn được sự hỗn loạn và rủi ro ở phía cơ sở dữ liệu. Dù vậy, một đề xuất kiểu mất hai ngày để thiết lập và tốn 80 USD mỗi tháng cho plugin/theme vẫn dễ bán hơn nhiều so với câu “được thôi, trước hết sẽ cần ít nhất hai tháng thời gian phát triển”.
      Ngay cả khi cần làm phát triển, cũng rất dễ tìm người có kinh nghiệm phát triển WordPress, và nếu không muốn tự tuyển thì cũng có rất nhiều agency chuyên WordPress. Những đối thủ mới nổi không có được lợi thế về quy mô như vậy. Thiết kế một hệ thống mở rộng được với cấu trúc plugin và theme tốt hơn WordPress rất nhiều không phải việc nhỏ, nhưng cũng không phải bất khả thi hay đòi hỏi một đội ngũ thiên tài. Nhưng trên con đường thực sự đánh bật WordPress khỏi thị trường, đó lại là bước dễ nhất
    • Có nhiều lựa chọn thay thế hoàn hảo về mặt chức năng, nhưng giá trị thực sự mà WordPress mang lại là hệ sinh thái plugin, nguồn nhân lực lập trình viên và tập người dùng ủng hộ.
      Hẳn ai cũng từng gặp khách hàng chỉ muốn WordPress và không thích thứ gì khác. Ngay cả khi triển khai một giải pháp mới gọn gàng hơn, nhiều khách hàng rồi cũng quay lại WordPress. Tôi đã thấy giá trị ở cách tiếp cận lai, nơi các yêu cầu phức tạp được xử lý bằng ứng dụng tùy biến xây trên framework khác, còn nội dung thì được xử lý qua một instance WordPress và các connector
    • Lý do WordPress thành công đến ngày nay là vì trong nhiều năm, khi các CMS khác liên tục phá vỡ API, WordPress nhìn chung vẫn giữ được tính ổn định, và nhờ đó một hệ sinh thái plugin khổng lồ đã phát triển.
      Ngoài ra, PHP API của WordPress hầu như không dùng lập trình hướng đối tượng mà chủ yếu là hàm và mảng, nên ngay cả người chỉ biết lập trình ở mức rất cơ bản cũng có thể tự tạo plugin hoặc theme
    • CMS mà lập trình viên muốn làm cùng và CMS mà công ty muốn dùng là hai thứ khác nhau. Để thâm nhập vào vế sau, phải thực hiện nhiều lựa chọn thực dụng khiến bạn rời xa vế trước.
      Các công ty thích những thứ đã tồn tại lâu năm, mà theo định nghĩa thì những thứ đó thường đã cũ
    • Đây: https://github.com/Qbix/Platform

  • Công nghệ đằng sau bản demo này thực sự rất ấn tượng. Sẽ thật tốt nếu có thể xem nhật ký lỗi/cảnh báo PHP theo thời gian thực, và tôi đặc biệt muốn kiểm tra xem trình mô phỏng này hoàn chỉnh đến mức nào, nhất là cả phần viết lại cơ sở dữ liệu SQLite.
    Việc thử nghiệm plugin hay theme cũng rất dễ. Chỉ cần thêm &plugin=plugin-slug-from-dir, và nếu slug khớp với slug plugin trong URL của WordPress.org thì nó sẽ tự động được tải xuống và thêm vào sandbox. Tài liệu đầy đủ về query API dùng để cấu hình sandbox có tại đây: https://wordpress.github.io/wordpress-playground/query-api/
    Tôi chắc chắn hẳn phải có cách mở hoặc hiển thị nhật ký debug. Nếu không có thứ đó thì họ đã không thể phát triển được cái này