SimCity chạy bằng WebAssembly và OpenGL trong trình duyệt web

 (micropolisweb.com)
3 điểm bởi GN⁺ 2024-06-17 | 1 bình luận | Chia sẻ qua WhatsApp
  • Micropolis Web, dựa trên SimCity Classic gốc của Maxis, đã được công bố dưới dạng chạy trong trình duyệt, cho phép trải nghiệm trò mô phỏng xây dựng thành phố kinh điển mà không cần cài đặt riêng
  • Dự án là phiên bản trò chơi do Will Wright thiết kế được Don Hopkins port lại, hiện vẫn chưa phải bản hoàn chỉnh mà ở trạng thái thử nghiệm và liên tục thay đổi
  • Kho GitHub, video demo, sách và sơ đồ của Chaim Gingold được cung cấp kèm theo, giúp tìm hiểu sâu hơn về cách triển khai và lịch sử của SimCity
  • Cách điều khiển sử dụng kéo chuột, bánh xe chuột, phím mũi tên, phím chữ, phím số, v.v., cho phép di chuyển, phóng to/thu nhỏ, tải thành phố, điều chỉnh tốc độ, thay đổi thuế suất và chuyển bộ tile
  • Tên “Micropolis” được sử dụng theo các điều khoản của Micropolis Public Name License; các tính năng bổ sung và easter egg vẫn đang được chuẩn bị

Micropolis Web chạy trong trình duyệt

Cách điều khiển và các lưu ý còn lại

  • Điều khiển bằng chuột

    • Kéo bằng nút trái để di chuyển màn hình
    • Có thể phóng to/thu nhỏ bằng bánh xe chuột

  • Điều khiển bằng bàn phím

    • Di chuyển màn hình bằng các phím mũi tên
    • Phóng to/thu nhỏ bằng phím dấu phẩy và dấu chấm
    • Tải nhiều thành phố khác nhau bằng các phím chữ
    • Tạo bằng phím \
    • Thiết lập tốc độ bằng các phím số
    • Bật/tắt tạm dừng bằng phím 0
    • Giảm hoặc tăng thuế suất bằng các phím ngoặc vuông
    • Chuyển bộ tile bằng phím - và =
    • Nhấn nút “X” ở phía trên để ẩn cửa sổ hướng dẫn
    • Các tính năng bổ sung và easter egg đang được chuẩn bị
    • Dòng cảnh báo bắt đầu bằng nội dung không được nhấn phím cách, nhưng trong phần văn bản được cung cấp, phần giải thích tiếp theo chưa hoàn chỉnh

Bài viết liên quan

1 bình luận

 
GN⁺ 2024-06-17
Ý kiến trên Hacker News

  • Việc port các trò chơi cũ lên web khá thú vị. Ngày nay có nhiều game còn nhỏ hơn cả các trang web thông thường, nên tải nhanh và chạy tốt
    Tôi vừa port Quake 3 và đang nghịch khá vui: https://thelongestyard.link/

    • Lý do tôi ghét trình duyệt khi làm game chính là độ trễ đầu vào. Dù vậy, công việc này vẫn rất tuyệt
    • Tôi tò mò không biết nên bắt đầu từ đâu để làm những thứ như thế này tốt hơn. Đặc biệt là hướng port các game cũ sang Wasm

  • Demo Micropolis Web 1: https://www.youtube.com/watch?v=wlHGfNlE8Os
    Micropolis Web là phiên bản trên trình duyệt của Micropolis, SimCity mã nguồn mở, sử dụng WebAssembly, WebGL và SvelteKit. Nó dựa trên mã nguồn SimCity Classic gốc do Will Wright thiết kế và Don Hopkins port; bản demo đầu tiên đã chạy được trình mô phỏng WebAssembly và hoạt ảnh tile bằng WebGL, nhưng phần lớn giao diện người dùng vẫn đang được phát triển
    Trang live: https://MicropolisWeb.com
    Mã nguồn và tài liệu: https://github.com/SimHacker/MicropolisCore
    Sách "Building SimCity" của Chaim Gingold: https://mitpress.mit.edu/9780262547482/building-simcity/
    "SimCity Reverse Diagrams" của Chaim Gingold: https://smalltalkzoo.thechm.org/users/Dan/uploads/SimCityRev...
    Micropolis Web Space Inventory Cellular Automata Music 1: https://www.youtube.com/watch?v=BBVyCpmVQew
    Nhạc do Juho Hietala, Blamstrain thực hiện, còn Space Inventory Cellular Automata do Don Hopkins triển khai: https://blamstrain.com/

    • Thật ngạc nhiên khi Building SimCity của Chaim Gingold vừa được xuất bản vào ngày 4 tháng 6 năm 2024. Trước đây tôi rất thích các sơ đồ thuật toán của SimCity, và hình như tôi cũng từng đọc luận án tiến sĩ đi sâu vào cơ chế hoạt động nội bộ của SimCity
      Gingold, Chaim. “Play Design.” Ph.D. thesis, University of California Santa Cruz, 2016. https://www.proquest.com/docview/1806122688
      Bản port Wasm của Micropolis có vẻ có thể trở thành một giai đoạn phát triển mới. SimCity Classic trên Macintosh đã ảnh hưởng lớn đến cách tôi suy nghĩ về máy tính và phần mềm khi còn nhỏ, và tôi rất vui khi thấy nó được thổi sức sống mới

  • Tôi không phải game thủ, nhưng vẫn nhớ hồi nhỏ từng chơi SimCity. Không biết lối chơi đã thay đổi trong khoảng 25 năm qua hay trình duyệt bị lỗi, nhưng trông như chẳng làm được gì cả
    Có thể tải một thành phố lên và xem nó hoạt động, nhưng tôi nhớ trong SimCity ngày xưa hình như mình có thể tự xây thành phố. Chẳng phải người chơi nên có cách để thực sự chơi sao?

  • Tôi không kỳ vọng nhiều trên di động, nhưng trên Firefox của Android, trang này đã làm trình duyệt bị treo hẳn. Tôi phải kill tiến trình, và chuyện như vậy rất hiếm khi xảy ra
    Nhân tiện, tôi có một game nhỏ tự port sang chạy trên trình duyệt. Nhờ tổ hợp Emscripten+SDL2 nên làm cho nó chạy được thì rất dễ, nhưng nói thật là phần tốn công nhất là làm sao để có thể chơi ổn trên điện thoại: https://play.neverball.org/

    • Chắc chắn tôi có ý định hỗ trợ di động. Tôi cũng đã sửa được một lỗi từng chặn chạy trên Firefox của Ubuntu nhờ một báo cáo lỗi được viết rất tốt, có kèm stack trace. Mong bạn thử lại, và nếu không được thì hãy báo lỗi kèm stack trace và thông tin nền tảng
      https://github.com/SimHacker/MicropolisCore/issues/1
      Thay vì chờ đến khi hoàn thiện và hoàn hảo, tôi muốn công khai sớm nhất có thể để người khác có thể chạy thử. Vì vậy vẫn còn rất nhiều việc phải làm như giao diện người dùng, độ ổn định, hỗ trợ đa nền tảng, di động, v.v.
      Ngay khi simulator và tile renderer hoạt động, tôi đã gắn vào các thao tác phóng to/di chuyển tối thiểu, giao diện điều khiển bằng bàn phím và một cửa sổ gợi ý có thể đóng bằng nút "+" ở góc trên bên phải
      Điều tôi thật sự mong đợi là tích hợp với các ngôn ngữ lập trình trực quan như Snap! để có thể tạo live coding, khu vực plugin, robot, hệ thống giám sát/điều khiển, trực quan hóa và xuất dữ liệu, cũng như các giao diện thay thế kiểu dashboard Grafana
      Điện thoại Android có thể kết nối với Mac hoặc PC bằng cáp USB, còn iPhone thì kết nối với Mac, rồi dùng Chrome hoặc trình gỡ lỗi Safari trên Mac để xem remote console, debug, thậm chí live coding. Nếu điều kiện phù hợp thì cũng có thể làm qua Wi-Fi, nhưng có thể Google đã gỡ tính năng đó hoặc Apple đã chặn ngay từ đầu
    • Tôi ngạc nhiên vì trên Firefox của một điện thoại Android giá rẻ 4 năm tuổi, tốc độ khung hình cao và gần như không giật. Không phải là có quá nhiều texture hay polygon, nhưng tôi không quen thấy hiệu năng như vậy trên trình duyệt của chiếc điện thoại này
    • Trên Firefox của Android thì phía tôi cũng không bị treo. Tuy nhiên tôi từng thấy một số phiên bản Firefox mới xử lý PDF không tốt lắm, nên có thể liên quan đến khác biệt phiên bản

  • Trước đây tôi đã port client RuneScape lên web
    https://play.rsps.app/
    Dùng Wasm, TypeScript và WebGL

  • Kho mã nguồn: https://github.com/SimHacker/MicropolisCore

  • Điều xảy ra khi nhấn phím cách thật sự đáng kinh ngạc. Fractal rất đẹp

    • Space Inventory được lấy cảm hứng từ bài review World Quester 2 của Game Helpin' Squad, và tôi cũng muốn làm menu cùng giao diện người dùng của Micropolis đỉnh như World Quester 2
      https://www.youtube.com/watch?v=0Gy9hJauXns

  • Không rõ các mô hình ngôn ngữ lớn liệu có thể port ngay lập tức những trò chơi như thế này không

  • Tại sao gần như mỗi block phố đều có trạm cứu hỏa vậy?

  • Không điều khiển được, và ngay khi trình duyệt bắt đầu tải gì đó thì quạt CPU bắt đầu quay. Có chắc đây không chỉ là một trình đào tiền mã hóa sơ sài không? Nếu không phải thì tôi không hiểu lý do công bố một thứ không hoạt động là gì

    • Mục đích là nhận phản hồi xem nó hoạt động ra sao trên nhiều hệ thống khác nhau mà tôi không thể tiếp cận. Tôi cho rằng phần mềm, đặc biệt là mã nguồn mở, nên nhận phản hồi càng sớm càng tốt trong quá trình phát triển, thay vì giấu kín cho đến khi hoàn tất và hoàn hảo
      Tôi cũng không có tiền mua đủ mọi loại máy tính và điện thoại, mà ngay cả nếu có thì cũng không có thời gian tự kiểm thử tất cả. Đây cũng không phải việc ai trả tiền cho tôi làm, nhưng nếu muốn thì bạn có thể ủng hộ qua Patreon: https://www.patreon.com/DonHopkins
      Dù vậy, dự án này là việc làm vì đam mê, không phải nguồn thu nhập. Hiện tôi còn có một gói đặc biệt: mỗi tháng tôi sẽ im lặng 5 phút về chủ đề bạn muốn
      Toàn bộ mã nguồn có thể xem trên GitHub, và bạn có thể báo lỗi hoặc tự build. Trình duyệt cũng có các công cụ gỡ lỗi và reverse engineering để xem xét binary WebAssembly và JavaScript đã biên dịch. Shader WebGL là văn bản thuần nên cũng có thể kiểm tra xem có khớp với mã nguồn trong kho hay không
      https://github.com/SimHacker/MicropolisCore
      Nếu tìm thấy bằng chứng về phần mềm đào coin sơ sài, bạn có thể báo cho FBI, Interpol và GitHub. Tôi công khai mã nguồn và binary bằng tên tôi, tài khoản GitHub của tôi và domain của tôi, nên cũng dễ truy ra nguồn gốc
      Một ví dụ về báo cáo lỗi hữu ích là báo cáo đã xác định được vấn đề kèm thông tin hệ thống và stack trace, nhờ đó tôi có thể sửa chỉ trong vài phút: https://github.com/SimHacker/MicropolisCore/issues/1
      Tôi cũng muốn biết bạn đã thử nhấn các phím số để điều chỉnh tốc độ chưa. Tính theo các phím số ở hàng trên bàn phím, "1" làm chậm xuống 1 khung hình/giây và 1 tick mô phỏng mỗi khung hình, còn "9" chạy ở 120 khung hình/giây và 50 tick mỗi khung hình. Trên Chrome ở máy Mac M1 của tôi, nó chạy mượt và giao diện cũng phản hồi khá tốt
      Sẽ rất hữu ích nếu bạn cho biết thao tác nào không hoạt động, phần cứng·hệ điều hành·trình duyệt·GPU của bạn là gì, và trong console dành cho nhà phát triển của trình duyệt có lỗi nào không. Báo cáo lỗi sẽ hữu ích hơn nếu kèm stack trace trong console