Terdapat GC (mekanisme kutipan sampah) dalam javascript. JavaScript ialah bahasa yang menggunakan mekanisme pengumpulan sampah Persekitaran pelaksanaan bertanggungjawab untuk mengurus memori apabila kod dilaksanakan, dan secara automatik memusnahkan objek sampah (objek yang tidak dirujuk) daripada memori.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.
Mekanisme kutipan sampah (GC) dalam JavaScript
Konsep berkaitan kutipan sampah
① Apa ialah sampah
Objek yang tidak digunakan (dirujuk) ialah sampah.
② Apakah pengumpulan sampah?
Objek yang tidak dirujuk dimusnahkan dan memori dilepaskan, iaitu pengumpulan sampah.
Bahasa pengaturcaraan seperti C dan C memerlukan pengumpulan sampah secara manual.
Pengumpulan sampah automatik untuk Java, JavaScript, PHP, Python dan bahasa lain.
JS mempunyai mekanisme pengumpulan sampah automatik, yang secara automatik akan memusnahkan objek sampah ini dari ingatan Kami tidak memerlukan dan tidak boleh melakukan operasi pengumpulan sampah. Apa yang perlu kita lakukan ialah menetapkan objek yang tidak lagi digunakan untuk null.
Mengapa pengumpulan sampah diperlukan
- Dalam C/C++, menjejaki penggunaan memori dan mengurus memori merupakan beban besar bagi pembangun
- JavaScript ialah Bahasa yang digunakan mekanisme pengumpulan sampah, yang bermaksud bahawa persekitaran pelaksanaan bertanggungjawab untuk mengurus memori apabila kod dilaksanakan, membantu pembangun meringankan beban ini
- Realisasikan peruntukan memori dan kitar semula sumber melalui pengurusan memori automatik
- The idea asas adalah sangat mudah, tentukan pembolehubah mana yang tidak akan digunakan lagi, dan lepaskan ruang ingatannya
- Proses ini adalah kitaran, bermakna program pengumpulan sampah akan dijalankan sekali-sekala
- Memori objek, rentetan dan objek dalam JS tidak ditetapkan Memori akan diperuntukkan secara dinamik hanya apabila ia benar-benar digunakan
- Kenangan ini perlu berada dalam Lepaskannya tidak digunakan supaya ia boleh digunakan semula, jika tidak, ia akan menyebabkan ranap selepas memori komputer yang tersedia habis
- Kaedah pengumpulan sampah utama dalam sejarah pembangunan pelayar ialah
- kaedah pengiraan rujukan
- Kaedah pembersihan tanda
Kaedah pengiraan rujukan
Idea
- Pembolehubah hanya merujuk kepada nilai
- Apabila pembolehubah merujuk kepada nilai, bilangan rujukan ialah 1
- Apabila rujukan kepada pembolehubah ditimpa atau dikosongkan, Bilangan rujukan -1
- Apabila bilangan rujukan ialah 0, memori ini boleh dikeluarkan dengan selamat.
let arr = [1, 0, 1] // [1, 0, 1]这块内存被arr引用 引用次数为1 arr = [0, 1, 0] // [1, 0, 1]的内存引用次数为0被释放 // [0, 1, 0]的内存被arr引用 引用次数为1 const tmp = arr // [0, 1, 0]的内存被tmp引用 引用次数为2
Masalah rujukan bulat
Netscape Navigator 3.0 mengguna pakai
- Dalam contoh ini, sifat ObjectA dan ObjectB masing-masing merujuk antara satu sama lain
- Akibatnya, selepas fungsi ini dilaksanakan, bilangan kali Objek dirujuk tidak akan menjadi 0, menjejaskan GC biasa.
- Jika dilaksanakan beberapa kali, ia akan menyebabkan kebocoran memori yang serius.
- Kaedah tanda dan jelas tidak mempunyai masalah ini.
function Example(){ let ObjectA = new Object(); let ObjectB = new Object(); ObjectA.p = ObjectB; ObjectB.p = ObjectA; } Example();
- Penyelesaian: Halakan ke nol pada penghujung fungsi
ObjectA = null; ObjectB = null;
Tandakan kaedah yang jelas
Untuk menyelesaikan masalah kebocoran memori yang disebabkan oleh rujukan bulat, Netscape Navigator 4.0 mula menggunakan kaedah tanda dan jelas
Dalam 2008, IE, Firefox, Opera, Chrome dan Safari semuanya menggunakan mark-sweep (atau variannya) dalam pelaksanaan JavaScript mereka, hanya berbeza dalam kekerapan mereka menjalankan pengumpulan sampah.
Idea
- Tandakan tanda "enter" apabila pembolehubah memasuki konteks pelaksanaan
- Pada masa yang sama, juga apabila pembolehubah meninggalkan konteks pelaksanaan Tandakan "tinggalkan"
- Mulai sekarang, pembolehubah ini tidak boleh diakses
- Memori akan dikeluarkan semasa kutipan sampah seterusnya
function Example(n){ const a = 1, b = 2, c = 3; return n * a * b * c; } // 标记Example进入执行上下文 const n = 1; // 标记n进入执行上下文 Example(n); // 标记a,b,c进入执行上下文 console.log(n); // 标记a, b, c离开执行上下文,等待垃圾回收
const dan biarkan pengisytiharan meningkatkan prestasi
- const dan biarkan bukan sahaja membantu meningkatkan gaya kod, tetapi juga membantu meningkatkan prestasi kutipan sampah
- const dan biarkan Beri JS skop peringkat blok Apabila skop peringkat blok tamat lebih awal daripada skop fungsi, program pengumpulan sampah campur tangan lebih awal
- Kitar semula memori yang dipulihkan seawal mungkin. , meningkatkan prestasi kutipan sampah
Kutipan sampah enjin V8
Kutipan sampah enjin V8 menggunakan kaedah mark-and-sweep dan kaedah pengumpulan generasi
Terbahagi kepada generasi baru dan generasi lama
Generasi baru
Saiz memoriSistem 32-bit 16M memori
Scavenge
Sistem 64-bit 32M memori
- Partition
- Memori generasi baru dibahagikan kepada dua kawasan berikut, Memori dibahagikan kepada separuh
- Dari ruang
- Ke angkasa
-
Lari
- Hanya Dari sebenarnya menjalankan ruang
- Ke angkasa terbiar
-
Algoritma
- 当From space内存使用将要达到上限时开始垃圾回收,将From space中的不可达对象都打上标记
- 将From space的未标记对象复制到To space。
- 解决了内存散落分块的问题(不连续的内存空间)
- 相当于用空间换时间。
- 然后清空From space、将其闲置,也就是转变为To space,俗称反转。
-
新生代 -> 老生代
- 新生代存放的是新分配的小量内存,如果达到以下条件中的一个,将被分配至老生代
- 内存大小达到From space的25%
- 经历了From space To space的一个轮回
- 新生代存放的是新分配的小量内存,如果达到以下条件中的一个,将被分配至老生代
老生代
老生代采用
mark-sweep
标记清除和mark-compact
标记整理
通常存放较大的内存块和从新生代分配过来的内存块
- 内存大小
- 32位系统700M左右
- 64位系统1.4G左右
- 分区
- Old Object Space
- 字面的老生代,存放的是新生代分配过来的内存。
- Large Object Space
- 存放其他区域放不下的较大的内存,基本都超过1M
- Map Space
- 存放存储对象的映射关系
- Code Space
- 存储编译后的代码
- Old Object Space
- 回收流程
- 标记分类(三色标记)
- 未被扫描,可回收,下面简称
1类
- 扫描中,不可回收,下面简称
2类
- 扫描完成,不可回收,下面简称
3类
- 未被扫描,可回收,下面简称
- 遍历
- 采用深度优先遍历,遍历每个对象。
- 首先将非根部对象全部标记为
1类
,然后进行深度优先遍历。 - 遍历过程中将对象压入栈,这个过程中对象被标记为
2类
。 - 遍历完成对象出栈,这个对象被标记为
3类
。 - 整个过程直至栈空
- Mark-sweep
标记完成之后,将标记为
1类
的对象进行内存释放
- 标记分类(三色标记)
-
Mark-compact
垃圾回收完成之后,内存空间是不连续的。
这样容易造成无法分配较大的内存空间的问题,从而触发垃圾回收。
所以,会有Mark-compact步骤将未被回收的内存块整理为连续地内存空间。
频繁触发垃圾回收会影响引擎的性能,内存空间不足时也会优先触发Mark-compact
垃圾回收优化
- 增量标记
- 如果用集中的一段时间进行垃圾回收,新生代倒还好,老生代如果遍历较大的对象,可能会造成卡顿。
- 增量标记:使垃圾回收程序和应用逻辑程序交替运行,思想类似Time Slicing
- 并行回收
- 在垃圾回收的过程中,开启若干辅助线程,提高垃圾回收效率。
- 并发回收
- 在逻辑程序执行的过程中,开启若干辅助线程进行垃圾回收,清理和主线程没有任何逻辑关系的内存。
内存泄露场景
全局变量
// exm1 function Example(){ exm = 'LeBron' } // exm2 function Example(){ this.exm = 'LeBron' } Example()
未清除的定时器
const timer = setInterval(() => { //... }, 1000) // clearInterval(timer)
闭包
function debounce(fn, time) { let timeout = null; return function () { if (timeout) { clearTimeout(timeout); } timeout = setTimeout(() => { fn.apply(this, arguments); }, time); }; } const fn = debounce(handler, 1000); // fn引用了timeout
未清除的DOM元素引用
const element = { // 此处引用了DOM元素 button:document.getElementById('LeBron'), select:document.getElementById('select') } document.body.removeChild(document.getElementById('LeBron'))
如何检测内存泄漏
这个其实不难,浏览器原带的开发者工具Performance就可以
- 步骤
- F12打开开发者工具
- 选择Performance工具栏
- 勾选屏幕截图和Memory
- 点击开始录制
- 一段时间之后结束录制
- 结果
- 堆内存会周期性地分配和释放
- 如果堆内存的min值在逐渐上升则存在内存泄漏
优化内存使用
1、尽量不在for循环中定义函数
// exm const fn = (idx) => { return idx * 2; } function Example(){ for(let i=0;i<1000;i++){ //const fn = (idx) => { // return idx * 2; // } const res = fn(i); } }
2、尽量不在for循环中定义对象
function Example() { const obj = {}; let res = ""; for (let i = 0; i < 1000; i++) { // const obj = { // a: i, // b: i * 2, // c: i * 3, // }; obj.a = i; obj.b = i * 2; obj.c = i * 3; res += JSON.stringify(obj); } return res }
3、清空数组
arr = [0, 1, 2] arr.length = 0; // 清空了数组,数组类型不变 // arr = [] // 重新申请了一块空数组对象内存
【推荐学习:javascript高级教程】
Atas ialah kandungan terperinci Adakah javascript mempunyai gc?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

React adalah rangka kerja front-end untuk membina antara muka pengguna; Rangka kerja back-end digunakan untuk membina aplikasi sisi pelayan. React menyediakan kemas kini UI yang komponen dan cekap, dan Rangka Kerja Backend menyediakan penyelesaian perkhidmatan backend lengkap. Apabila memilih timbunan teknologi, keperluan projek, kemahiran pasukan, dan skalabiliti harus dipertimbangkan.

Hubungan antara HTML dan React adalah teras pembangunan front-end, dan mereka bersama-sama membina antara muka pengguna aplikasi web moden. 1) HTML mentakrifkan struktur kandungan dan semantik, dan React membina antara muka dinamik melalui komponenisasi. 2) Komponen React Gunakan sintaks JSX untuk membenamkan HTML untuk mencapai rendering pintar. 3) Kitaran Hayat Komponen Menguruskan Rendering HTML dan Kemas kini secara dinamik mengikut keadaan dan atribut. 4) Gunakan komponen untuk mengoptimumkan struktur HTML dan meningkatkan keupayaan. 5) Pengoptimuman prestasi termasuk mengelakkan penyampaian yang tidak perlu, menggunakan atribut utama, dan menjaga tanggungjawab tunggal komponen.

React adalah alat pilihan untuk membina pengalaman front-end interaktif. 1) React memudahkan pembangunan UI melalui komponen dan DOM maya. 2) Komponen dibahagikan kepada komponen fungsi dan komponen kelas. Komponen fungsi adalah lebih mudah dan komponen kelas menyediakan lebih banyak kaedah kitaran hayat. 3) Prinsip kerja React bergantung kepada algoritma DOM dan perdamaian maya untuk meningkatkan prestasi. 4) Pengurusan negeri menggunakan useState atau ini. Kaedah kitaran hayat seperti ComponentDidMount digunakan untuk logik tertentu. 5) Penggunaan asas termasuk membuat komponen dan pengurusan negeri, dan penggunaan lanjutan melibatkan cangkuk tersuai dan pengoptimuman prestasi. 6) Kesalahan biasa termasuk kemas kini status yang tidak betul dan isu prestasi, kemahiran debugging termasuk menggunakan reactdevtools dan sangat baik

React adalah perpustakaan JavaScript untuk membina antara muka pengguna, dengan komponen terasnya dan pengurusan negeri. 1) Memudahkan pembangunan UI melalui komponen dan pengurusan negeri. 2) Prinsip kerja termasuk perdamaian dan rendering, dan pengoptimuman dapat dilaksanakan melalui React.Memo dan Usememo. 3) Penggunaan asas adalah untuk membuat dan membuat komponen, dan penggunaan lanjutan termasuk menggunakan cangkuk dan konteksapi. 4) Kesalahan biasa seperti kemas kini status yang tidak betul, anda boleh menggunakan ReactDevTools untuk debug. 5) Pengoptimuman prestasi termasuk menggunakan react.memo, senarai virtualisasi dan codesplitting, dan menyimpan kod yang boleh dibaca dan dikekalkan adalah amalan terbaik.

React menggabungkan JSX dan HTML untuk meningkatkan pengalaman pengguna. 1) JSX membenamkan HTML untuk menjadikan pembangunan lebih intuitif. 2) Mekanisme DOM maya mengoptimumkan prestasi dan mengurangkan operasi DOM. 3) UI pengurusan berasaskan komponen untuk meningkatkan kebolehkerjaan. 4) Pengurusan negeri dan pemprosesan acara meningkatkan interaktiviti.

Komponen React boleh ditakrifkan oleh fungsi atau kelas, merangkumi logik UI dan menerima data input melalui prop. 1) Tentukan komponen: Gunakan fungsi atau kelas untuk mengembalikan elemen bertindak balas. 2) Rendering Component: React Call Render Kaedah atau Melaksanakan Komponen Fungsi. 3) Komponen multiplexing: Lulus data melalui prop untuk membina UI yang kompleks. Pendekatan kitaran hayat komponen membolehkan logik dilaksanakan pada peringkat yang berbeza, meningkatkan kecekapan pembangunan dan pemeliharaan kod.

React Mode Strict adalah alat pembangunan yang menyoroti isu -isu yang berpotensi dalam aplikasi React dengan mengaktifkan cek tambahan dan amaran. Ia membantu mengenal pasti kod warisan, hayat yang tidak selamat, dan kesan sampingan, menggalakkan amalan reaksi moden.

Serpihan bertindak balas membolehkan kumpulan kanak -kanak tanpa nod dom tambahan, meningkatkan struktur, prestasi, dan kebolehaksesan. Mereka menyokong kekunci untuk rendering senarai yang cekap.


Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

MinGW - GNU Minimalis untuk Windows
Projek ini dalam proses untuk dipindahkan ke osdn.net/projects/mingw, anda boleh terus mengikuti kami di sana. MinGW: Port Windows asli bagi GNU Compiler Collection (GCC), perpustakaan import yang boleh diedarkan secara bebas dan fail pengepala untuk membina aplikasi Windows asli termasuk sambungan kepada masa jalan MSVC untuk menyokong fungsi C99. Semua perisian MinGW boleh dijalankan pada platform Windows 64-bit.

Versi Mac WebStorm
Alat pembangunan JavaScript yang berguna

SecLists
SecLists ialah rakan penguji keselamatan muktamad. Ia ialah koleksi pelbagai jenis senarai yang kerap digunakan semasa penilaian keselamatan, semuanya di satu tempat. SecLists membantu menjadikan ujian keselamatan lebih cekap dan produktif dengan menyediakan semua senarai yang mungkin diperlukan oleh penguji keselamatan dengan mudah. Jenis senarai termasuk nama pengguna, kata laluan, URL, muatan kabur, corak data sensitif, cangkerang web dan banyak lagi. Penguji hanya boleh menarik repositori ini ke mesin ujian baharu dan dia akan mempunyai akses kepada setiap jenis senarai yang dia perlukan.

Dreamweaver Mac版
Alat pembangunan web visual

Pelayar Peperiksaan Selamat
Pelayar Peperiksaan Selamat ialah persekitaran pelayar selamat untuk mengambil peperiksaan dalam talian dengan selamat. Perisian ini menukar mana-mana komputer menjadi stesen kerja yang selamat. Ia mengawal akses kepada mana-mana utiliti dan menghalang pelajar daripada menggunakan sumber yang tidak dibenarkan.