Sử dụng Memory Inspector (Trình kiểm tra bộ nhớ) mới để kiểm tra bộ nhớ ArrayBuffer
, TypedArray
và DataView
trong JavaScript cũng như WebAssembly.Memory
của các ứng dụng Wasm được viết bằng C++.
Mở Trình kiểm tra bộ nhớ
Có một số cách để mở Trình kiểm tra bộ nhớ.
Mở từ trình đơn
- Mở Công cụ cho nhà phát triển.
- Nhấp vào biểu tượng Tuỳ chọn khác > Công cụ khác > Trình kiểm tra bộ nhớ.
Mở trong khi gỡ lỗi
- Mở một trang bằng JavaScript
ArrayBuffer
. Chúng ta sẽ sử dụng trang minh hoạ này. - Mở Công cụ cho nhà phát triển.
- Mở tệp demo-js.js trong bảng điều khiển Sources (Nguồn), đặt điểm ngắt ở dòng 18.
- Hãy làm mới trang.
- Mở rộng phần Phạm vi trên ngăn Debugger (Trình gỡ lỗi) bên phải.
Bạn có thể mở Trình kiểm tra bộ nhớ:
- Từ biểu tượng. Nhấp vào biểu tượng bên cạnh thuộc tính
buffer
, hoặc - Từ trình đơn theo bối cảnh. Nhấp chuột phải vào thuộc tính
buffer
rồi chọn Hiển thị trong bảng điều khiển Trình kiểm tra bộ nhớ.
- Từ biểu tượng. Nhấp vào biểu tượng bên cạnh thuộc tính
Kiểm tra nhiều đối tượng
- Bạn cũng có thể kiểm tra DataView hoặc TypedArray. Ví dụ:
b2
là mộtTypedArray
. Để kiểm tra nội dung đó, hãy nhấp chuột phải vào thuộc tínhb2
rồi chọn hiển thị trong bảng điều khiển Trình kiểm tra bộ nhớ (Chưa có biểu tượng choTypedArray
hoặcDataView
). - Một thẻ mới sẽ mở trong Trình kiểm tra bộ nhớ. Xin lưu ý rằng bạn có thể kiểm tra nhiều đối tượng cùng một lúc.
Trình kiểm tra bộ nhớ
Trình kiểm tra bộ nhớ bao gồm 3 khu vực chính:
Thanh điều hướng
- Phương thức nhập địa chỉ hiển thị địa chỉ byte hiện tại ở định dạng hex. Bạn có thể nhập một giá trị mới để chuyển đến một vị trí mới trong vùng đệm bộ nhớ. Ví dụ: hãy thử nhập
0x00000008
. - Vùng đệm bộ nhớ có thể dài hơn một trang. Thay vì cuộn qua, bạn có thể sử dụng nút trái và phải để điều hướng.
- Các nút ở bên trái cho phép di chuyển tiến/lùi.
- Theo mặc định, vùng đệm sẽ tự động cập nhật khi bước. Trong trường hợp không, nút refresh sẽ cung cấp cho bạn tuỳ chọn làm mới bộ nhớ và cập nhật nội dung trong đó.
Vùng đệm bộ nhớ
- Ở bên trái, address sẽ xuất hiện ở định dạng hex.
- Memory (bộ nhớ) cũng được hiển thị ở định dạng hex, mỗi byte được phân tách bằng một dấu cách. Byte đang được chọn sẽ được đánh dấu. Bạn có thể nhấp vào byte hoặc di chuyển bằng bàn phím (trái, phải, lên, xuống).
- Bản trình bày ASCII của bộ nhớ sẽ xuất hiện ở bên phải. Phần được đánh dấu sẽ hiển thị giá trị tương ứng với các bit được chọn trên byte. Tương tự như bộ nhớ, bạn có thể nhấp vào byte hoặc điều hướng bằng bàn phím (trái, phải, lên, xuống).
Công cụ kiểm tra giá trị
- Thanh công cụ trên cùng có nút để chuyển đổi giữa endian lớn và nhỏ, cũng như để mở phần cài đặt. Mở chế độ cài đặt để chọn loại giá trị họ muốn xem theo mặc định trong công cụ kiểm tra.
- Khu vực chính hiển thị tất cả diễn giải giá trị theo chế độ cài đặt. Theo mặc định, tất cả thẻ sẽ hiển thị.
- Mã hoá có thể nhấp vào được. Bạn có thể chuyển đổi giữa tháng 12, hex, oct cho số nguyên và sci, dec cho số thực.
Kiểm tra bộ nhớ
Hãy cùng kiểm tra bộ nhớ.
- Làm theo các bước sau để bắt đầu gỡ lỗi.
- Thay đổi địa chỉ thành
0x00000027
trong mục nhập địa chỉ. - Quan sát bản trình bày ASCII và diễn giải giá trị. Hiện tại, tất cả giá trị đều trống.
- Hãy lưu ý nút Jump to address (Chuyển đến địa chỉ) màu xanh dương bên cạnh
Pointer 32-bit
vàPointer 64-bit
. Bạn có thể nhấp vào nút đó để chuyển đến địa chỉ đó. Các nút này sẽ chuyển sang màu xám và không thể nhấp vào được nếu địa chỉ không hợp lệ. - Nhấp vào Tiếp tục thực thi tập lệnh để duyệt qua mã.
- Lưu ý rằng tính năng biểu diễn ASCII hiện đã được cập nhật. Tất cả các diễn giải giá trị cũng được cập nhật.
- Hãy tuỳ chỉnh Công cụ kiểm tra giá trị để chỉ hiển thị dấu phẩy động. Nhấp vào nút settings (Cài đặt) và chỉ đánh dấu chọn Float 32-bit và Float 64-bit.
- Hãy thay đổi phương thức mã hoá từ
dec
thànhsci
. Hãy lưu ý rằng cách biểu diễn giá trị được cập nhật tương ứng. - Thử di chuyển trong vùng đệm bộ nhớ bằng bàn phím hoặc thanh điều hướng. Lặp lại bước 4 để quan sát các thay đổi về giá trị.
Kiểm tra bộ nhớ WebAssembly
Đối tượng WebAssembly.Memory
là một ArrayBuffer
chứa các byte thô của bộ nhớ đối tượng. Bảng điều khiển Memory Inspector (Trình kiểm tra bộ nhớ) cho phép bạn kiểm tra các đối tượng như vậy trong các ứng dụng Wasm được viết bằng C++.
Để khai thác tối đa tính năng kiểm tra của WebAssembly.Memory
:
- Sử dụng Chrome 107 trở lên. Vui lòng kiểm tra phiên bản của bạn tại
chrome://version/
. - Cài đặt tiện ích Hỗ trợ công cụ cho nhà phát triển C/C++ (DWARF). Đây là trình bổ trợ để gỡ lỗi ứng dụng C/C++ WebAssembly bằng thông tin gỡ lỗi DWARF.
Cách kiểm tra WebAssembly.Memory
của một đối tượng:
- Mở Công cụ cho nhà phát triển trên trang minh hoạ này.
- Trong bảng Sources (Nguồn), hãy mở
demo-cpp.cc
rồi đặt một điểm ngắt trong hàmmain()
ở dòng 15:x[i] = n - i - 1;
. - Hãy tải lại trang để chạy ứng dụng. Trình gỡ lỗi sẽ tạm dừng tại điểm ngắt.
- Trong ngăn Debugger (Trình gỡ lỗi), hãy mở rộng Scope (Phạm vi) > Local (Cục bộ).
Nhấp vào biểu tượng bên cạnh mảng
x: int[10]
.Ngoài ra, bạn có thể nhấp chuột phải vào mảng rồi chọn Hiển thị trong bảng điều khiển Trình kiểm tra bộ nhớ.
Để dừng đánh dấu bộ nhớ đối tượng, trong bảng điều khiển Memory Inspector (Trình kiểm tra bộ nhớ), hãy di chuột qua huy hiệu đối tượng rồi nhấp vào nút x
.
Để tìm hiểu thêm, hãy xem: