JavaScript'te ArrayBuffer, TypedArray ve DataView belleğin yanı sıra C++ dilinde yazılmış Wasm uygulamalarının WebAssembly.Memory kadarını incelemek için Bellek denetleyicisini kullanın.
Genel Bakış
Bellek denetleyicisi, bellek içeriğini düzenler ve büyük dizilerde hızlı bir şekilde gezinmenize yardımcı olur. Bellek içeriğinin ASCII değerlerini doğrudan baytların yanında görüntüleyebilir ve farklı endianlık değerleri seçebilirsiniz. Verimli bir iş akışı için web uygulamanızda hata ayıklarken Bellek İnceleyici'yi kullanın.
Bellek Denetleyicisi'ni açın
Bellek denetleyicisi'ni açmanın birkaç yolu vardır.
Menüden aç
- Geliştirici Araçları'nı açın.
- Diğer Seçenekler'i tıklayın
> Diğer araçlar > Bellek denetleyicisi.
Hata ayıklama sırasında aç
ArrayBufferJavaScript içeren bir sayfa açın. Bu demo sayfasını kullanacağız.- Geliştirici Araçları'nı açın.
- Kaynaklar panelinde demo-js.js dosyasını açın ve 18. satırda bir ayrılma noktası belirleyin.
- Sayfayı yenileyin.
- Sağ Hata Ayıklayıcı bölmesinde Kapsam bölümünü genişletin.
Bellek denetleyicisi'ni açabilirsiniz:
- Simgeden.
buffermülkünün yanındaki simgeyi tıklayabilir veya - İçerik menüsünden.
bufferözelliğini sağ tıklayın ve Bellek Denetleyicisi panelinde göster'i seçin.
- Simgeden.
Birden çok nesneyi inceleme
- DataView veya TypedArray'i de inceleyebilirsiniz. Örneğin,
b2birTypedArray. Bunu incelemek içinb2özelliğini sağ tıklayın ve Bellek Denetleyicisi panelinde göster'i seçin (TypedArrayveyaDataViewiçin henüz simge yok). - Bellek denetleyicisinde yeni bir sekme açılır. Aynı anda birden fazla nesneyi inceleyebileceğinizi lütfen unutmayın.
Bellek Denetleyicisi
Bellek denetleyicisi 3 ana alandan oluşur:
Gezinme çubuğu
- Adres girişi, geçerli bayt adresini onaltılık biçimde gösterir. Bellek arabelleğinde yeni bir konuma atlamak için yeni bir değer girebilirsiniz. Örneğin,
0x00000008yazmayı deneyin. - Bellek arabellekleri bir sayfadan daha uzun olabilir. Gezinmek için ekranı kaydırmak yerine sol ve sağ düğmelerini kullanabilirsiniz.
- Soldaki düğmeler ileri/geri gezinmeye olanak tanır.
- Arabellek, varsayılan olarak adımlama sırasında otomatik olarak güncellenir. Aksi takdirde, yenile düğmesi size belleği yenileme ve içeriğini güncelleme seçeneği sunar.
Bellek arabelleği
- Adres, sol tarafta onaltılık biçimde gösterilir.
- Bellek de onaltılık biçimde gösterilir. Her bayt boşlukla ayrılır. O anda seçili olan bayt vurgulanır. Baytı tıklayabilir veya klavyeyle (sol, sağ, yukarı, aşağı) gezinebilirsiniz.
- Belleğin ASCII gösterimi sağ tarafta gösterilir. Vurgulama, bayt üzerindeki seçili bitlere karşılık gelen değeri gösterir. Belleğe benzer şekilde, baytı tıklayabilir veya klavyeyle (sol, sağ, yukarı, aşağı) gezinebilirsiniz.
Değer denetleyici
- Üstteki araç çubuğunda, büyük ve küçük endian arasında geçiş yapmak ve ayarları açmak için bir düğme bulunur. İnceleyicide varsayılan olarak görmek istedikleri değer türlerini seçmek için ayarları açın.
- Ana alanda, ayarlara göre tüm değer yorumları gösterilir. Varsayılan olarak tümü gösterilir.
- Kodlama tıklanabilir. Tamsayı için ondalık, onaltılık, sekiz, kayan noktalı sayılar için onaltılık, onaltılık değerleri arasında geçiş yapabilirsiniz.
Bellek inceleme
Hafızayı birlikte inceleyelim.
- Hata ayıklama işlemini başlatmak için bu adımları uygulayın.
- Adres girişinde adresi
0x00000027olarak değiştirin.
- ASCII gösterimini ve değer yorumlamalarını gözlemleyin. Şu anda tüm değerler boş.
Pointer 32-bitvePointer 64-bitsimgelerinin yanındaki mavi renkli Adrese git düğmesine dikkat edin. Adresi tıklayarak adrese gidebilirsiniz. Adresler geçerli değilse düğmeler devre dışıdır ve tıklanamaz.
- Kodda ilerlemek için Komut dosyası yürütmeyi devam ettir'i tıklayın.
- ASCII temsilinin artık güncellendiğine dikkat edin. Tüm değer yorumları da güncellenir.
- Değer inceleyici'yi yalnızca kayan noktayı gösterecek şekilde özelleştirelim. Ayarlar düğmesini tıklayın ve yalnızca Kayan 32 bit ve Kayan 64 bit'i işaretleyin.
decolan kodlamayısciolarak değiştirelim. Değer temsillerinin buna göre güncellendiğine dikkat edin.
- Klavyenizle veya gezinme çubuğunu kullanarak bellek arabelleğinde gezinmeyi deneyin. Değerlerin değişip değişmediğini görmek için 4. adımı tekrarlayın.
WebAssembly bellek incelemesi
WebAssembly.Memory nesnesi, nesne belleğinin ham baytlarını barındıran bir ArrayBuffer. Bellek Denetleyici paneli, C++'ta yazılan Wasm uygulamalarında bu tür nesneleri incelemenize olanak tanır.
WebAssembly.Memory denetiminden tam olarak yararlanmak için:
- Chrome 107 veya sonraki bir sürümü kullanın. Sürümünüzü
chrome://version/adresinden kontrol edebilirsiniz. - C/C++ Geliştirici Araçları Desteği (DWARF) uzantısını yükleyin. Bu, DWARF hata ayıklama bilgilerini kullanarak C/C++ WebAssembly uygulamalarında hata ayıklamaya yönelik bir eklentidir.
Bir nesnenin WebAssembly.Memory bölümünü incelemek için:
- Bu demo sayfasında Geliştirici Araçları'nı açın.
- Kaynaklar panelinde
demo-cpp.ccöğesini açın ve 15. satırdakimain()işlevinde bir kesme noktası ayarlayın:x[i] = n - i - 1;. - Uygulamayı çalıştırmak için sayfayı yeniden yükleyin. Hata ayıklayıcı, kesme noktasında duraklar.
- Hata Ayıklayıcı bölmesinde Kapsam'ı genişletin > Local (Yerel).
x: int[10]dizisinin yanındaki
simgesini tıklayın.Alternatif olarak, diziyi sağ tıklayıp Bellek Denetleyicisi panelinde göster'i seçebilirsiniz.
Nesne belleğini vurgulamayı durdurmak için Bellek Denetleyicisi panelinde fareyle nesne rozetinin üzerine gelin ve x düğmesini tıklayın.
Daha fazla bilgi edinmek için aşağıdaki makaleleri inceleyin: