这是一个我主导开发的宠物品种全生命周期信息平台,核心目标是为养宠家庭和专业人士提供一站式的品种数据、健康风险与科学喂养指南,我负责从架构设计到核心功能实现的全流程前端开发工作。
项目采用 React + TypeScript 构建,结合 Ant Design 组件库与 Tailwind CSS 实现了响应式、易维护的界面体系。为了高效展示 244 个犬猫品种数据,我设计了多维度筛选与排序系统,支持按被毛类型、体型、原产地快速过滤,并实现了虚拟列表懒加载,让用户在海量数据中也能流畅浏览。同时,我开发了 “品种对比”“收藏夹” 等功能模块,方便用户横向对比不同品种的健康特性、饲养难度,快速锁定心仪的宠物。
针对项目中的数据可视化与交互体验需求,我用 ECharts 实现了品种常见疾病发病率统计、不同体型犬猫的寿命分布等图表;为了保障数据的准确性与专业性,前端实现了严格的数据校验与权限控制,对接后端安全接口,实现了敏感数据脱敏与请求拦截。
在性能优化方面,我对图片资源进行了 WebP 格式转换与 CDN 分发,配合骨架屏、预加载等策略,大幅提升了页面加载速度;并通过代码分割、Tree Shaking 等工程化手段,将首屏加载时间压缩了 40% 以上。平台上线后,已收录 179 种犬、65 种猫的完整信息,为用户提供了从品种选择到健康管理的全链路支持。