近半个月来一直继继续续对网站进行更新改造，沉浸在使用WorkBuddy的过程中，腾讯这款Ai真的真的太他妈好用了，别的Ai是有手就行，而这款是有想法就行，他可以完全接替我的工作，直接对你硬盘上的文件进行修改、新增、删除，这搞的我人都变懒了，其他Ai甚至于不会用了！
[toc]
主体结构
这是最大的变化可以说，之前我用Nuxt+Aue3做的前后端分离，用了大概半个月吧，突然发现这玩意不够轻量，含组件在内可以达到几百M，对于强迫症的我来说完全不能接受。
另一个主要原因是我喜欢源码简洁，这咋形容呢，你在页面点右键-查看源码，Nuxt是SSR渲染的，直接呈现完全的HTML结构，看着特别不爽，当然这可能是我心里扭曲，源码并不是给人看的，可就是不爽，也曾试着改为SSG渲染，仍不符合我的心意。
于是React就出现在我的眼中，这是典型的SPA单页应用，订制度很高，思前想后还是决定在大刀阔虎的改造一次，用了半个月学习一下相关知识，开干！！！
整体还算顺利，在WorkBuddy的加持下用了四天时间做出了框架，之后就是不停的优化完善，直到现在……
这就是我想要的效果，怎么样，够清爽的吧！
动态优化
这里变化不大，细微的调整一下，主要目的是把首页、内页统一结构，加上头像看上去更像微信动态一点。
灯箱
移除了原有的@fancyapps/ui包，想着灯箱不就是弹窗显示吗，何必要为此安装一个包，新建一个组件替换掉他，兼容图片与视频、移动端下支持左右滑动切换上下张，效果还不错。
结构非常简单，仅仅展示大图而已，这就足够轻量了。
游记时间线
这部分主要是改写React语法，做了一些优化，主要参考｜孤斗，内在不同外观照抄的，这次更新加入了标签和连线功能，这个页面可以说是耗时最多也最难，完全靠自已的想法让Ai去实现，走了很多很多弯路。
就拿连线来说，最早实现的效果是鼠标移上去连线即显现，但感觉过于生硬，就想做出跟孤斗一样的往前延伸的动画效果，这就费了大力气。
第一版虚线做成了流动的感觉，忘了截图！
第二版箭头是独立的动画，反正无法做到箭头带着虚线出去，动起来的时候不明显，暂停就会发现原来箭头是这样的😫
第三版虚线先过去让箭头延迟显示，还是不满意。
最后还是想到了办法。
让箭头逐帧跟随，始终跟在虚线最前端一起运动，箭头通过 state 逐帧更新位置，完美解决。
至此，终于做出满意的效果，又可以消停一断时间了！
评论 理性讨论，文明发言