title: Vue.js and Immutable.js
body: <p>I'm working on a Vue.js application where I have to deal with deeply nested data structures (trees and <a href="https://en.wikipedia.org/wiki/Tree_(graph_theory)#Forest" rel="noreferrer">forests</a>).</p>
  
  <p>After reading about using simple data structures, pure functions and reducing (non-local) mutation, I belief that embracing those ideas would increase the maintainability and simplicity of my code.</p>
  
  <p>While implementing a tree manipulation module using nothing but pure functions, I learned two things:</p>
  
  <ul>
  <li>avoiding unintentional mutation of nested objects in JavaScript requires a lot of attention and discipline, especially with larger teams</li>
  <li>I don't like littering my code with <a href="https://lodash.com/docs/4.17.4#cloneDeep" rel="noreferrer"><code>cloneDeep()</code></a> invocations</li>
  </ul>
  
  <p>Yesterday, I stumbled upon <a href="https://facebook.github.io/immutable-js/" rel="noreferrer">Immutable.js</a>, which looks great to me. After a bit of playing around with it, I feel like it makes my pure functions much easier to reason about. </p>
  
  <p>My Vue.js components would use <a href="https://facebook.github.io/immutable-js/docs/#/Map/toJS" rel="noreferrer"><code>fromJS(treeNode)</code></a> and <a href="https://facebook.github.io/immutable-js/docs/#/Map/toJS" rel="noreferrer"><code>treeNode.toJS()</code></a> when interacting with the manipulation module.</p>
  
  <p><strong>My question</strong>: is it technically possible to Vue.js and Immutable.js together? What are things to keep in mind? Are people using this combination in production? I found this <a href="https://forum.vuejs.org/t/immutable-js-with-vue/6366" rel="noreferrer">post</a>, which seems to suggest the opposite. That's all I could find.</p>
  
  <p>What are the caveats or practical downsides? Would you suggest to use Immutable.js or to keep deeply cloning regular objects?</p>
  
  <p><em>edit: updated my question in response to the votes, to make it (less) opinion-based</em></p>