简易的记账本
一道来自xmind的前端笔试题，写着挺有意思的，不妨记录一下哈
如下:
本题目的基本需求为构建一个简易的记账本应用程序。
我们将为你提供一份以 CSV 形式存储的数据表格，里面包含了一份虚构的账单数据, 加载我们所提供的数据；
以列表的形式展示账单内容，并且提供下拉框选择月份进行筛选，其中列表中所展示的账单为选择月份的账单；
简单地统计并展示所选月份的收入和支出总金额。
以上为本题目的基本需求，而如果你需要应聘的岗位为高级前端工程师或以上岗位，则需要完成以下附加需求：
对账单分类进行二次筛选；
对选择月份内的所有账单根据账单分类进行支出金额统计，并进行排序。
思路
根据题目的描述，如果使用业界的mvvm前端框架，很快就能完成题目的需求，但这样又会少了很多意思，于是我的想法是，能否参考vue，react等框架，自己实现一个mvvm的demo出来，把之前所了解的的理论概念实践起来。
实践
Proxy + Snabbom
浏览器dom节点的创建，更新等操作是非常消耗性能的，于是使用sanbbdom虚拟dom的管理dom的变化，通过proxy拦截filter条件变量set方法，在条件发生变化时候，触发生成最新的vnode，通过sanbbdom的diff计算，尽可能复用原有的dom节点。在细节处理中，简单增加了一个cache缓存，优化查找分类的效率。
online: https://codesandbox.io/s/xmind-75dqm?file=/index.html