当前位置: 首页 > 面试经验 >

蚂蚁前端暑期实习一面(电话)

优质
小牛编辑
160浏览
2023-03-28

蚂蚁前端暑期实习一面(电话)

蚂蚁面试官问问题的角度好刁钻,而且语速很快很快,一不注意就会被他带跑了。不过仔细复盘之后觉得他问的问题都挺有价值的,在这里记录一下。

虚拟DOM到底是如何提升性能的?(问的很详细,最好能列举出真实DOM,虚拟DOM的操作行为例子)

  1. 减少重绘回流次数

比如向一个<ui>列表添加5个<li>,如果直接操作真实DOM,那么浏览器需要经历5次回流;

但使用虚拟DOM在更新完后再异步批量更新真实DOM,一次性插入5个,浏览器只需要经历一次回流。

2.diff算法可以尝试对DOM进行复用,可以减少一些可能的DOM操作

虚拟DOM未必一定能提升性能,需要分情况讨论:

  • 小量数据更新: 当页面的渲染数据高达几万条,但只需要修改某一条数据时,Virtual DOM的Diff比对算法,能够避免不必要的DOM操作,节省开销
  • 大量数据更新: 当页面的渲染数据高达几万条, 但是更新的数据却非常大,甚至全量更新,Virtual DOM无法进行优化, 加剧了性能的浪费
  • 给一个二维平面点坐标的集合,如(2,3)(4,5),将这些点依次按顺序连线,判断最后连成的图形是否是一个三角形

    我的思路:

    1. 判断第一个点和最后一个点是否相同,若不同则直接返回false(首尾不相连)。
    2. 维护一组直线方程参数ABC,分别对应Ax+By+C=0。遍历点集,根据当前点和下一个点计算一组ABC并和之前的ABC比较是否全等,若全等则代表当前点和前后两个点共线,否则代表当前点是一个拐点,同时将ABC更新为新计算出的ABC。
    3. 遍历完成后检查是否一共恰好有3组不同的ABC(分别代表三角形的三条边的直线方程参数),若是则返回true,否则返回false

    面试官说思路可以,但实操起来不太可行,但我自己琢磨也不是很难实现啊...

    关于上面的问题,欢迎各位在评论区多多指教~

     类似资料: