Is there any way to manage lots of data changing and element rendering JS Library?

[ghtty3]

I was writing an really complex page with shopify, it contains a lots of reactive problems(data change -> page change).However, with the page become more and more complex, I found that handle data manage and render html become more and more hard! 

So, I want to find a framework, which could help me to handle the data and page in Shopify Liquid!

or, is there any way to realize this, I tried handlebarsjs , but it doesn't solve my problem!

I am thinking writing a libarary which could transform real dom to virtual dom, so that I could handle the data without other concern!

this is the structure