创新实训（十二）项目总结

一、项目整体介绍

这学期的项目实训中我们组选择的课题是分布式异步联邦学习平台。联邦学习主要体现在不同用户之前的数据集不共享，通过共享模型参数参与聚合间接达到同数据集共享达到的相近效果；分布式是将训练和聚合分别放在不同机器上运行，充分利用硬件资源加速整个训练过程；同时这里的异步训练是完全的，不同用户的运算速度和参与时间是不同的，为了去解决这个问题，我们采取的方式是设置权重，根据参与用户进行的聚合轮次，为其分配不同的权重，以平衡用户上传的模型参数对全局模型参数的影响。
我们平台的主要功能是给予用户发布和参与联邦学习任务的平台以及模型文件（.py文件）和模型参数（.model文件）的共享平台。这里先介绍一下第一个功能——给予用户发布和参与联邦学习任务，用户可以根据自己的需求，发布联邦学习任务供其他用户参与，一同进行模型训练优化当前模型，其他人可以在任务大厅看到当前的所有任务，点击查看详情可以看到任务的具体细节，从而选择适合自己的任务参与。接下来是第二个功能——模型文件和模型参数的共享，任务在训练完成之后，会统一存放在历史任务中，用户可以点击查看当前已经训练完成的任务，同时可以根据自己的需求去下载对应的模型和模型参数进行使用。

二、个人完成工作

在本次项目中，我主要负责的是前端界面绘制。在技术选型上，前端我选用了Vue3+elementPlus的组合。在代码量上，前端总的代码量在4500行左右，其中我完成的代码量在3500行左右。

三、个人开发流程和里程碑

前端开发是基于对项目有充分理解的基础上的，因此开发之前必须对整个项目的结构、原理有一个基本的了解。了解功能的基础上，把它转化成前端的展示形式、编写逻辑，向后端展示接口。我觉得这是对前端负责人的第一个挑战。
就前端的开发流程而言，我采用的是先整体后细节的实现。首先明确总体的前端结构，然后对每个界面、每个功能点，去做相应的设计，和后端沟通确认无误之后，进行具体的实现。最后在前端的美观性等方面进行美化优化。
就我个人的项目开发里程碑而言，大概如下：前四周主要是参与项目架构的讨论、进行前端技术的学习（HTML+CSS+Javascript+Vue3+ElementPlus…）；4-8周完成了前端的第一个版本，实现了训练过程可视化等基本功能；9-10周完成了前端框架的迭代，更新了更为美观和可扩展的框架，并编写了顶栏、侧边栏、路由跳转等；10-12周完成了主页面的编写，以及登录注册页面，整个项目雏形完成；13-14周对任务相关的界面完成了绘制，包括所有任务、发布任务、个人任务等界面；15-16周完成了前端剩余界面的编写，以及加入了一些新的亮点功能。最后和后端聚合端进行通讯、集成、调试，从而完成了整个项目。

四、项目难点和心得

下面是我个人编写前端时的难点和心得总结：
1、界面美观。一个美观的前端界面对于项目很重要，这决定了对用户的吸引程度。因此我在上面花费了很多心血。我学习了诸如Pure-Admin、Vue-Lite-Admin、Vue-Admin-Box等成熟的前端项目，学习了其项目架构、界面设计、美化方法。我总结出的我的前端设计的原则：一致、反馈、效率、活力。一致：所有的元素和结构需保持一致，与现实生活的流程、逻辑保持一致，遵循用户习惯的语言和概念。反馈：给用户良好的使用反馈，通过界面样式和交互动效让用户可以清晰的感知自己的操作，比如加入动画、覆盖效果等。效率：设计简洁直观的操作流程，界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。活力：针对的客户是年轻群体，所以在界面设计上尽可能有一些活力，提升用户体验。
2、前端亮点功能。除了基本的前端界面，我还费尽心思实现了一些先进的亮点功能。包括：自定义动画、导航栏伸缩、echarts图表、全屏、暗黑主题、引导页、路由守卫、先进的CSS框架……在实现这些功能的时候，我调研并学习了大量的第三方库。对这些功能的实现是让我比较满意和自豪的。
3、组件化。Vue3一直提倡的一个观点就是组件化，这一点只有在编写了大量编码的基础上才能体会出来。每一个前端组件，我编写完成后都在考虑能够将其组件化。组件化的好处有很多，比如将程序模块化，比如解耦。这是一种应该养成的良好的思维习惯。
4、CSS的编写。其实前端中CSS的编写是比较难的，编写起来十分繁杂。但是美观必须建立在CSS的基础上。为此我在技术选型上引入了Tailwind CSS，这是一个功能类优先的 CSS 框架，它集成了诸如 flex, pt-4, text-center 和 rotate-90 这样的的类，它们能直接在脚本标记语言中组合起来，构建出任何设计。这种CSS预处理器很好的帮助我分担了CSS的设计编写工作。
5、卡片化的设计思想。每个成熟的前端项目都有自己的设计思想。比如我们的项目中，我大量采用的一致性的设计思想就是卡片化。我发现这是一种比较美观有活力的设计思想，把组件包裹在卡片中，既保持了边界，又有整体性，还美观。这算是我的一个前端设计思想上的奇妙构想。最后界面的一致性、美观性都得到了体现。
6、尽可能的向一个成熟现代化的前端项目靠拢。这句话有两个含义，一是见贤思齐，多向成熟优秀的前端项目学习，比如我学习了诸如Pure-Admin、Vue-Lite-Admin、Vue-Admin-Box等成熟的前端项目，仔细研读了它们的源码，学习了其项目架构、界面设计、美化方法。二是项目架构、代码编写方式的成熟化，我尽可能的让我的前端代码看起来就是一个成熟的项目，架构明确清晰。

五、不足之处

当然，缺点不足也是有的。我觉得前端上不足的点，我体会很深刻的是没有一个统一的接口文档。接口文档的重要性不言而喻，但是我们小组一直没有生成一个文档，这让我很遗憾。虽然大家也尝试用注释的形式来辅助，但是治根不治本，这直接导致了后来在聚合的时候大家四分五裂，难免出现不一致的现象。我越发认识到项目管理中的一些方法应用在实际项目开发中的重要性。

六、结语

以上就是我的个人项目总结报告，总体来说，收获颇丰，也略有遗憾，富有成就感。感谢创新实训给了我们这样一个机会，去合力完成了一个实际的软件项目开发的整个流程，感谢各位老师的指导。完结撒花。