从非根组件的路由跳转到根组件,有内存泄漏问题,组件已销毁,但DOM Nodes没有减少 #2409
Unanswered
Gcgetget
asked this question in
Help and Questions
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Reproduction
从非根组件的路由跳转到根组件,有内存泄漏问题
Steps to reproduce the bug
在首面,通过路由跳转到table box组件,再从table box组件通过路由跳转到首页,手动进行垃圾回收,DOM Nodes并没有减少,说明存在内存泄漏问题。如下图演示:
![image](https://private-user-images.githubusercontent.com/31995767/388935184-2c76a5c1-8c90-44d5-8e3e-aec9dcf920d4.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzUxODQtMmM3NmE1YzEtOGM5MC00NGQ1LThlM2UtYWVjOWRjZjkyMGQ0LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWM0ZjZlMGEyMGZmZGE5MjU3ZWUwMzBjOTFmYWJhZjdhNDRkOTlmNDZjNDM4YjhiZGIxNzgxMTAyYjNjNDBlNjgmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.bhvI2c-bp0JhkdCJZgrzw08fhmTDPoC_XLGs9xZr49U)
![image](https://private-user-images.githubusercontent.com/31995767/388935413-34a2e5c2-77f2-4678-9ceb-d747e9ff6451.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzU0MTMtMzRhMmU1YzItNzdmMi00Njc4LTljZWItZDc0N2U5ZmY2NDUxLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTI0OTIxMmY5ZjYxZTUwN2FhZGQ5NDMxYWU1OTYzYjlmYzliMTZlMTgzYTNjMGFkMDgzN2Q2MGJkOGM5MmE1NGYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.MprJEZ6jvvbmxwiJZuonQ_uJ8G99Ry8eKWFD7KDuVfE)
![image](https://private-user-images.githubusercontent.com/31995767/388935685-fcbfc56d-f01d-4549-b8ed-526e5d3ec979.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzU2ODUtZmNiZmM1NmQtZjAxZC00NTQ5LWI4ZWQtNTI2ZTVkM2VjOTc5LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTNiYTZhODE3ZjYzYWI1NjE3NzExZGU4YWRhMWRjNDQ2MmExODQxZGMwZjE3NzY5MGQyMDgzZTQ2NGUyYWVkNjYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.-m3J1OKk6Uvz0Z4vGCpl9GFjAi_soLmXvmZtJYhuBu0)
![image](https://private-user-images.githubusercontent.com/31995767/388935790-0eb52c57-4740-4841-8ff3-e18d0dd8e22c.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzU3OTAtMGViNTJjNTctNDc0MC00ODQxLThmZjMtZTE4ZDBkZDhlMjJjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTM1Mjk3Y2NmYzY2YjY0M2MxNjU4ZDFjN2ZhZjk5YjkzNDUwZTJiNGQ1NjJmZThlZWVhNzhlNTQxNWE3YTk3ODAmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.57GIom1PlmD2MdSNaXDcIBpdvl7L30592SE_-J7fCDc)
路由跳转到table box组件:
在table box组件跳转到首页:
手动垃圾回收,DOM Nodes并没有减少
但是,在table box组件,点击首页的路由Go to home,则不会有内存泄漏
![image](https://private-user-images.githubusercontent.com/31995767/388936321-a8784b7f-2de3-493b-a35a-d5299a561483.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzYzMjEtYTg3ODRiN2YtMmRlMy00OTNiLWEzNWEtZDUyOTlhNTYxNDgzLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTUwMjU1OTg1NGY2YjA5ZjFlNjYyODRkYmJiMjBmNWE4MjZiNzY3NGE5ZTNjYjA5MmMyMTJlNjMwOTJlZmEwOTUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.yZehLPK_3kUQf8YV6FndJj1Xx7g8G6EZiOMouyruDj4)
![image](https://private-user-images.githubusercontent.com/31995767/388936462-e2850d23-51e0-49a6-a40a-7cd0ef5afe60.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzY0NjItZTI4NTBkMjMtNTFlMC00OWE2LWE0MGEtN2NkMGVmNWFmZTYwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWFhY2NhMzkxMjI2MjQ4ZDUxYWNhNTFiOTZjN2I4MDFlY2ViN2M4YjNiMjVjZWI2MmQ3ZDkwMzE1MTM3NjhkNWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.vvM255IjzsrE_omd1oMpQfI7rl1mfv7y0L7HkTZsv4k)
跳转后:
路由配置:
![image](https://private-user-images.githubusercontent.com/31995767/388927004-160564fc-f4ae-4245-8c26-e72f46ea223c.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MjcwMDQtMTYwNTY0ZmMtZjRhZS00MjQ1LThjMjYtZTcyZjQ2ZWEyMjNjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTVlMGFjNjUwNDc4MzVhYzM3OTZjNTFjMWNmYTU1MmI4MWZkOGExZGYyNzFmMmI5OTQ2YTEwNjFkYmNjMTMyNTAmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.NLNWKU6ulpndM0tx0RxJ_C6PscIwjstRyFKJt0WnlRI)
![image](https://private-user-images.githubusercontent.com/31995767/388936729-c71e89fb-832e-4adc-acbd-5288ccf8e1dc.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzY3MjktYzcxZTg5ZmItODMyZS00YWRjLWFjYmQtNTI4OGNjZjhlMWRjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWNhOGRjMDY3YzFiOTBkNjg5MjMwZmI1MzU3NzRkZTM0NmI0MWExZWQzNTM5N2M3ZTZkYjM2MjExZjNhNzE0NGMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.hLgcHJc0kGrBDu7A9KusYByLdMfaI-a4IhsnmA5XpAc)
![image](https://private-user-images.githubusercontent.com/31995767/388936871-e9451d93-2c4b-4879-b91e-13f0ed15f2cc.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzY4NzEtZTk0NTFkOTMtMmM0Yi00ODc5LWI5MWUtMTNmMGVkMTVmMmNjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWQ4YWQ3ZTg3ZDkxNmY1NTgxOGU3Y2YyOWYxNTBmMzRlZDBlODNlMmM2YTk3ZmE3YTNiMjczMTBiNzY2ZGQ4N2YmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.IAkIIZHPB0As37TPFJfUujj91-cVcnywwVzlfJFtG-0)
![image](https://private-user-images.githubusercontent.com/31995767/388937057-0804654c-ca66-4877-9b3b-808df2bdd9d7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzk0MDcyNDUsIm5iZiI6MTczOTQwNjk0NSwicGF0aCI6Ii8zMTk5NTc2Ny8zODg5MzcwNTctMDgwNDY1NGMtY2E2Ni00ODc3LTliM2ItODA4ZGYyYmRkOWQ3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEzVDAwMzU0NVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPThlZmZhNjcyOWRkNzA0OGY4NGFhNjMzZjJiNGM4YWRiODA1NDQ4YTMzNjNiN2RhOWU1Yzg2ZmMzMDAyZjIzMjkmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.wBOkvHa2Q6wJP3k3fOoZUDuxPcLNs6C3QURiggupTo4)
App.vue:
RouterNav.vue:
table box组件:
Expected behavior
从首页路由跳转到table box组件,再从table box组件通过路由跳转到首页,table box组件销毁,DOM Nodes应该下降
Actual behavior
从首页路由跳转到table box组件,再从table box组件通过路由跳转到首页,table box组件销毁,DOM Nodes没有下降,说明有内存泄漏风险
Additional information
"vue": "^3.4.29",
"vue-router": "^4.4.5"
Beta Was this translation helpful? Give feedback.
All reactions