项目介绍
项目总结
企业门户网站+后台管理(TP5+Vue+Fastadmin)采用最熟悉的技术栈,学习成本较低。
开发周期
2023/10/20——2023/11/1(开发周期)
2023/11/1——2023/11/19(部署、测试、改需求)
关于前端
动画库:animate.css、wow.js、aos、swiper.js(轮播js)
组件库:elementUI、vuetify、bootstrap、fastadmin
资源库:Google Font、Font Awesome Icons
前端设计
弹窗、锚点定位、轮播图、矢量绘图(svg)、交叉渲染(index%2)、悬浮动画、加载动画、定位动画、滚动变色、镂空效果、视觉落差、cookie跳转、图片预览、节点渲染(富文本渲染)、时间戳转换及时间获取、动态修改页面title。
问题思考
1.前期拥抱bootstrap主题,发现纯css库不如组件库好用,在vue兼容方面不合适。
2.后期element ui短板,内容较少过于基础,引入vuetify组件库,同时发现小部分样式冲突(vuetify和自定义类名冲突导致)。
3.ajax数据传递后,发现动画和渲染数据的时间问题,渲染时间事件慢于动画渲染,此处加入定时器解决。同时推荐渲染数据的ajax数据请求设置在mounted中。(定时器的硬伤:受网速影响,定时器设置过长又会影响用户体验)。
4.图片懒加载提高加载效率。
5.样式文件集成度较高,增加了内联样式的覆写,降低了一定的利用率。
6.MVC为单体架构(模型-视图-控制器都在一个应用内),虽是前后端分离的设计模式,但是开发过程中耦合度不低。可以进一步降低耦合度,拥抱前端框架项目结构。
7.善用控制台,监测cookie、http请求,以及快速调整样式。宝塔在线修改前端,真的让人心累。效率太低!过程冗杂!留意硬盘缓存,项目迁移,资源请求失败可能是原始硬盘缓存未更新。
关于后端
后端设计
请求集成、随机读取、分页、数据处理(生成、遍历、计数、分割、去重、转换类型、关联、过滤)、模糊查询、数据库设计(数据类型多测试!贴合生产环境!bigint存放时间戳、varchar(5000)/longtext存放多图地址、text存放链接地址、外码约束需谨慎可以不设置)、分片上传(大文件上传必要手段,不可暴力调参)、全路径配置CDN(全路径暴力破解前端路径读取问题)、框架源码修改(部分)、回显设置、伪静态配置。