项目描述：该项目是基于 Electron，React 开发的桌面级应用，通过websocket连接获取中心测产生的异常事件预警，并通过react-motion插件进行动画过渡，实现预警弹出，定时收回，展示详情等功能。 项目技术： react，electron，antd，mobx 项目成绩： 1.该项目有多个窗口：登录窗口，等待窗口，主窗口和详情窗口。一次性加载所有窗口会很耗费性能，所以我采用了分段加载的方式才渲染窗口，即登录窗口渲染时创建等待窗口并隐藏，将渲染进程的html文件注入窗口容器。显著提升了应用加载的速度，提高了用户体验。 2.项目最大的难点在于窗口可移动。因为在无预警时，需要将窗口缩为小图标（类似360小气球），移动时记录最终的位置并固定，当有预警信息时，需要窗口回到右上角并展开列表。我取鼠标的四种状态来记录位置，并通过down事件比对原有位置来区分点击还是移动的方式完成了该需求。 3.因为该应用是内网安装，所以我使用了配置文件来对应用初始化，使用node的fs模块获取文件并用ini插件解析文件内容，在渲染进程中获取配置信息。

项目描述： 该项目是基于 React 开发的车型识别系统，通过api让应用层调度算法识别车型，并将识别结果展示于页面。主要的模块有历史查询，视频采集，相机设置，系统设置，设备信息。目前数千个智能盒分布于全国各大城市。 项目技术： react，react-router，antd，mobx 项目成绩： 1.使用webpack搭建脚手架开发项目，并对webpack的配置加以优化，加入了缓存，启用了多进程编译，分离公共代码，加快了程序启动的速度。 2.历史查询模块的多个页面大同小异，所以我采用了抽离公共组件，通过不同页面的url后缀来读取对应的页面配置。减少了代码的重复，也更利于页面修改，提高了后续维护的效率。 组件和方法方面，抽离所有的公共组件，公共方法，每一个模块对应各自的组件，是的程序模块与模块之间尽量做到低耦合。

项目描述： 该项目是基于 React 开发的路口车辆检测平台，将摄像头流接入算法层进行检测分析，对异常事件进行整合消费。主要的模块有数据运营，路口管理，区域管理，报表中心。 项目技术： react，react-router，react-konva，antd，mobx 项目成绩： 1.项目在开发过程中需要封装一个canvas组件，用于绘制俯视道路图，并能通过传参的方式对道路图进行修改。通过调研选择react-konva这个库，先限定画布的大小，然后通过计算得出每条道路的位置及长度，以group为单位绘制。通过旋转进而组合多个路口。整个组件分为若干个独立模块，限定props格式，易于使用和修改。 2.页面方面，将同一板块的多个相似页面进行组件抽离，通过传入的type决定渲染内容，这样做一是减少了重复代码，二是在后期版本更新迭代时，也能迅速找到修改位置，提高了代码的可为维护性。 3.数据运营模块涉及多个数据可视化，我采用了echarts-react，以多个模块的方式封装成一整个可视化组件。并通过websocket获取实时数据，更新组件数据。 4.canvas组件导出道路俯视图后，在中心测大屏上需要有实时车辆动画。算法层给出实时点位以及横向角，我通过websockt获取车辆的实时点，然后根据横向角来旋转车辆达到动画效果。

小姐姐真好看