打開您的網站(記得啟動網頁伺服器,6502web運行時使用fetch加載二進位文件,我們需要一個為此運行的網絡伺服器:3)

還有... 那是什麼? !

\\\"Web

如果你打開devtools,你可以看到,不知何故,一個

元素已出現並帶有“HI!”作為其內容..但是如何? !讓我們再看一下 6502 程式碼,現在有註解了!

LDA #0   ; 0 is the ID of a 

element in 6502web runtime, lets load itSTA $46 ; store it to $46, which is start of our RAM memorySTA $0; by storing to $0, we RUN a built-in function which is responsible for creating an HTML element, that uses $46 as its argument (what HTML element to create!)LDA #3 ; 3 will now be the length of the string we want to put in our

!STA $46 ; store it at $46LDA #72 ; \\'H\\' in ASCII!STA $47 ; store it at $47LDA #73 ; \\'I\\' in ASCII!STA $48 ; store it at $48LDA #33 ; \\'!\\' in ASCII!STA $49 ; store it at $49STA $1; storing to $1 runs another built-in function, that is responsible for setting up text content of a *recently* created HTML element. Its first argument is length of the string it has to read, and then it reads memory fields (ASCII characters) after that, corresponding to the length we stored at $46

所以.. 這基本上就是 6502web 運行時的工作原理。目前僅實現了少量功能:

透過少量的功能,我能夠創建一個非常簡單的計數器應用程式!

\\\"Web

\\\"Web

我相信現在就夠了,如果你有興趣,可以自己來看一下,只是要注意這個運行時間主要是一個笑話(我花了很多功夫的一個笑話)

我仍在努力,所以許多操作碼尚未實現。

GitHub

祝大家有美好的一天!

","image":"http://www.luping.net/uploads/20240918/172662264966ea2bb9b2959.png","datePublished":"2024-09-18T09:24:09+08:00","dateModified":"2024-09-18T09:24:09+08:00","author":{"@type":"Person","name":"luping.net","url":"https://www.luping.net/articlelist/0_1.html"}}
」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 組裝中的 Web 應用程式!

組裝中的 Web 應用程式!

發佈於2024-09-18
瀏覽:466

MOS 6502 是經濟實惠運算領域的一大進步。感謝這個小傢伙,我們了解了 Commodore64、Apple II、
Atari2600 和 NES。直到今天,人們仍在使用 6502 Assembly,為這些被遺忘的平台創建軟體和遊戲。

現在,讓我介紹一下自己 - 我是Cassiopeia(但是,我在正式場合使用 Oliwia),一位熱愛舊技術和彙編編程的跨性別女性。我擔任 JavaScript 開發人員已有六年多了。大部分時間我都使用典型的 Web 技術,例如 Vue、React 和 Angular。儘管我的大部分經驗來自前端開發,但我從程式設計中獲得的大部分樂趣卻來自後端開發。大約一年前,我對舊科技感到驚訝,這就是 6502 的用武之地。

6502 只有(!)56 條指令,但即使指令數量如此有限,開發人員(一如既往)也可以創建令人印象深刻的程式。
您有沒有想過使用 6502 編寫 Web 應用程式會是什麼樣子?

不?

當然不是,為什麼你會這麼想? !

但我...!我想過這個! 我想過如何組裝你的6502程序,上傳它並讓它生成一個網站!

6502網頁

歡迎來到6502Web,這是一個用 JavaScript 編寫的 6502 運行時,它使得使用 6502 程序集創建(簡單)網站和 Web 應用程式成為可能!

我想讓我的運行時盡可能簡單並且盡可能少使用 javascript,特別是因為這是我第一次寫這樣的東西。

首先,組裝你的6502程序,為了測試我主要使用masswerk彙編器,因為它對我來說是最快的。

讓我們從簡單的事情開始,試著寫這樣的程式:

LDA #0
STA $46
STA $0
LDA #3
STA $46
LDA #72
STA $47
LDA #73
STA $48
LDA #33
STA $49
STA $1

現在您已經下載了 .bin 文件,請將 6502web cdn 連結到您的網頁應用程式。

然後,您可以載入二進位檔案並運行它,如下所示:

打開您的網站(記得啟動網頁伺服器,6502web運行時使用fetch加載二進位文件,我們需要一個為此運行的網絡伺服器:3)

還有... 那是什麼? !

Web Applications in ssembly!

如果你打開devtools,你可以看到,不知何故,一個

元素已出現並帶有“HI!”作為其內容..但是如何? !讓我們再看一下 6502 程式碼,現在有註解了!

LDA #0   ; 0 is the ID of a 

element in 6502web runtime, lets load it STA $46 ; store it to $46, which is start of our RAM memory STA $0 ; by storing to $0, we RUN a built-in function which is responsible for creating an HTML element, that uses $46 as its argument (what HTML element to create!) LDA #3 ; 3 will now be the length of the string we want to put in our

! STA $46 ; store it at $46 LDA #72 ; 'H' in ASCII! STA $47 ; store it at $47 LDA #73 ; 'I' in ASCII! STA $48 ; store it at $48 LDA #33 ; '!' in ASCII! STA $49 ; store it at $49 STA $1 ; storing to $1 runs another built-in function, that is responsible for setting up text content of a *recently* created HTML element. Its first argument is length of the string it has to read, and then it reads memory fields (ASCII characters) after that, corresponding to the length we stored at $46

所以.. 這基本上就是 6502web 運行時的工作原理。目前僅實現了少量功能:

  • 建立 HTML 元素,
  • 設定HTML元素的文字內容
  • 新增事件監聽器
  • 將 X 和 Y 暫存器綁定到 HTML 元素
  • 6502和JS共享記憶體

透過少量的功能,我能夠創建一個非常簡單的計數器應用程式!

Web Applications in ssembly!

Web Applications in ssembly!

我相信現在就夠了,如果你有興趣,可以自己來看一下,只是要注意這個運行時間主要是一個笑話(我花了很多功夫的一個笑話)

我仍在努力,所以許多操作碼尚未實現。

GitHub

祝大家有美好的一天!

版本聲明 本文轉載於:https://dev.to/cassiopeiaoli/web-applications-in-6502-assembly-3g0k?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>
  • 增強您的 Web 動畫:像專業人士一樣最佳化 requestAnimationFrame
    增強您的 Web 動畫:像專業人士一樣最佳化 requestAnimationFrame
    流畅且高性能的动画在现代 Web 应用程序中至关重要。然而,管理不当可能会使浏览器的主线程过载,导致性能不佳和动画卡顿。 requestAnimationFrame (rAF) 是一种浏览器 API,旨在将动画与显示器的刷新率同步,从而确保与 setTimeout 等替代方案相比更流畅的运动。但有效...
    程式設計 發佈於2024-11-06
  • 為什麼MySQL伺服器在60秒內就消失了?
    為什麼MySQL伺服器在60秒內就消失了?
    MySQL 伺服器已消失- 恰好在60 秒內在此場景中,之前成功運行的MySQL 查詢現在遇到了60 秒後逾時,顯示錯誤「MySQL 伺服器已消失」。即使調整了 wait_timeout 變量,問題仍然存在。 分析:超時正好發生在 60 秒,這表明是設置而不是資源限制是原因。直接從 MySQL 客戶...
    程式設計 發佈於2024-11-06
  • 為什麼帶有“display: block”和“width: auto”的按鈕無法拉伸以填充其容器?
    為什麼帶有“display: block”和“width: auto”的按鈕無法拉伸以填充其容器?
    了解具有“display: block”和“width: auto”的按鈕的行為當您設定“display: block”時一個按鈕,它會調整其佈局以佔據可用的整個寬度。但是,如果將其與“width: auto”結合使用,則按鈕會出現意外行為,並且無法拉伸以填充其容器。此行為源自於按鈕作為替換元素的基...
    程式設計 發佈於2024-11-06
  • 為 Bluesky Social 創作機器人
    為 Bluesky Social 創作機器人
    How the bot will work We will develop a bot for the social network Bluesky, we will use Golang for this, this bot will monitor some hashtags ...
    程式設計 發佈於2024-11-06
  • 為什麼 PHP 的浮點運算會產生意外的結果?
    為什麼 PHP 的浮點運算會產生意外的結果?
    PHP 中的浮點數計算精度:為什麼它很棘手以及如何克服它在PHP 中處理浮點數時,這一點至關重要了解其固有的準確性限制。如程式片段所示:echo("success");} else {echo("error");} 您可能會驚訝地發現,儘管值之間的差異小於0....
    程式設計 發佈於2024-11-06
  • Python中可以透過變數ID逆向取得物件嗎?
    Python中可以透過變數ID逆向取得物件嗎?
    從 Python 中的變數 ID 擷取物件參考Python 中的 id() 函數傳回物件的唯一識別。人們很容易想知道是否可以反轉此過程並從其 ID 取得物件。 具體來說,我們想要檢查取消引用變數的ID 是否會擷取原始物件:dereference(id(a)) == a瞭解引用的概念及其在Python...
    程式設計 發佈於2024-11-06
  • Go 的 Defer 關鍵字如何在函數執行順序中發揮作用?
    Go 的 Defer 關鍵字如何在函數執行順序中發揮作用?
    了解 Go 的 Defer 關鍵字的功能使用 Go 時,了解 defer 關鍵字的行為至關重要。此關鍵字允許開發人員推遲函數的執行,直到周圍的函數返回。但是,需要注意的是,函數的值和參數在執行 defer 語句時進行評估。 範例:評估 Defer Order為了說明這一點,請考慮以下內容代碼:pac...
    程式設計 發佈於2024-11-06
  • WordPress Gutenberg 全域狀態管理初學者指南
    WordPress Gutenberg 全域狀態管理初學者指南
    构建复杂的 WordPress 块编辑器 (Gutenberg) 应用程序时,有效管理状态变得至关重要。这就是 @wordpress/data 发挥作用的地方。它允许您跨 WordPress 应用程序中的不同块和组件管理和共享全局状态。 如果您不熟悉管理全局状态或使用@wordpress/data,...
    程式設計 發佈於2024-11-06
  • 亞馬遜解析簡單且完全由您自己完成
    亞馬遜解析簡單且完全由您自己完成
    I came across a script on the Internet that allows you to parse product cards from Amazon. And I just needed a solution to a problem like that. I wrac...
    程式設計 發佈於2024-11-06
  • React JSX 如何在幕後轉換為 JavaScript
    React JSX 如何在幕後轉換為 JavaScript
    當您編寫 React 時,您會經常看到 JSX – 在 JavaScript 程式碼中看起來像 HTML 的語法。但你有沒有想過這段程式碼在瀏覽器中是如何運作的呢? 神奇之處在於:JSX 不是有效的 JavaScript!瀏覽器無法直接理解它。在幕後,像 Babel 這樣的工具介入將 JSX 轉換...
    程式設計 發佈於2024-11-06
  • 如何透過 CSS 變換實現傾斜:兩側傾斜
    如何透過 CSS 變換實現傾斜:兩側傾斜
    使用CSS 變換實現傾斜:傾斜兩側提供的圖像展示了一種有趣的傾斜效果,該效果使元素的兩個角都形成角度。若要使用 CSS 轉換重新建立此效果,請按照下列步驟操作:應用透視傾斜:若要新增透視,請使用下列 CSS屬性:transform: perspective(distance) rotateY(ang...
    程式設計 發佈於2024-11-06
  • Express.js 基礎:初學者指南 - Node.js 教學系列 - 第 10 部分
    Express.js 基礎:初學者指南 - Node.js 教學系列 - 第 10 部分
    介紹: 嘿!如果您是 Node.js 新手,您可能聽說過 Express.js——一個用於建立 Web 伺服器和 API 的輕量級、快速且靈活的框架。在本指南中,我將引導您了解 Express 的基礎知識,並向您展示入門是多麼容易。 準備好?讓我們開始吧! 1....
    程式設計 發佈於2024-11-06
  • Python:未來的語言
    Python:未來的語言
    在不断发展的技术领域,某些编程语言已经占据主导地位,并塑造了我们构建软件和与软件交互的方式。其中,Python 脱颖而出,它不仅获得了巨大的普及,而且还将自己定位为未来技术的关键工具。其简单性、多功能性和强大的库使 Python 成为从 Web 开发到数据科学、人工智能、自动化等各种应用程序的首选语...
    程式設計 發佈於2024-11-06
  • 如何在 PHP 中將 PDF 檔案儲存為 MySQL BLOB(帶有程式碼範例)?
    如何在 PHP 中將 PDF 檔案儲存為 MySQL BLOB(帶有程式碼範例)?
    使用PHP 將PDF 檔案儲存為MySQL BLOB使用PHP 在MySQL 中將PDF 檔案儲存為BLOB(二進位大物件)時,建議考慮在資料庫中儲存二進位資料的潛在缺點。但是,如果您選擇這樣做,可以採用以下方法:首先,定義一個包含整數 ID 欄位和名為 DATA 的 BLOB 欄位的資料表。 用於...
    程式設計 發佈於2024-11-06
  • 使用 React Router v6 在 React 中實作麵包屑
    使用 React Router v6 在 React 中實作麵包屑
    面包屑在网页开发中非常重要,因为它们为用户提供了一种方法来跟踪他们在我们网页中的当前位置,并帮助我们的网页导航。 在本指南中,我们将使用 React-router v6 和 Bootstrap 在 React 中实现面包屑。 React-router v6 是 React 和 React Nati...
    程式設計 發佈於2024-11-06

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3