Bug
前端
用户设置相关
| bug说明 |
修复方法 |
修复结果 |
| 用户修改头像后导航不同步更新 |
修改用户头像后刷新this.$store中的图像路径 |
成功 |
| 左侧侧边栏第一次无自适应，后续自适应排版 |
去除后续自适应，统一改为遮挡型导航 |
成功 |
| 上传头像过程中退出，仅重回设置界面才会更新头像 |
添加全局storage存储头像路径 |
成功 |
| 设置默认词图单词数量在进入页面时就显示警告 |
将规则检查变为懒检查，仅在提交时触发 |
成功 |
缓存相关
| bug说明 |
修复方法 |
修复结果 |
| 编辑词图推出后最新修改时间未改变 |
重新回到我的词图界面后刷新更新时间 |
成功 |
| 从社区fork词图后我的词图界面无显示 |
重新回到我的词图界面后清空缓存重新请求 |
成功 |
词图相关
| bug说明 |
修复方法 |
修复结果 |
| 我的词图中svg预览大小不一、存在白边 |
canvas截图时设定固定尺寸 |
成功 |
| 教程进行到中途退出后回从头开始 |
新增用户教程学习状态机，记忆用户浏览进度 |
成功 |
| 显示单词列表时缺失“熟识”状态单词的显示 |
补充缺失分支 |
成功 |
| 测试时浮窗显示前于视觉中心移动导致浮窗位置不正确 |
浮窗显示设置睡眠时间，待以动结束后苏醒显示 |
成功 |
| 截取svg缩略图时背景图片仅部分被包含 |
记忆背景图片坐标，在截图时设置 |
成功 |
| 对不同分辨率的背景图片的普适性较差 |
修改为提供动态图床由用户选择的方式实现背景图转换，控制图片分辨率一致 |
成功 |
| 测试时键盘监听不够敏感，出现光标切换异常等不顺滑清空 |
将监听方式由keyup改为keydown，并特判开头等特殊情况的光标位置 |
成功 |
| 已完成加词的词图可以添加自定义单词 |
根据当前词图状态判断是否开启自定义选项 |
成功 |
社区相关
| bug说明 |
修复方法 |
修复结果 |
| 预览词图时单词列表无法获取api正常返回值 |
新增预览专用api，取消相关用户权限检查 |
成功 |
| 词图排序修改后不及时改变，刷新后才能修改 |
在切换子页面时刷新缓存 |
成功 |
| 自定义搜索加词时查询过慢，智能联想延迟较大 |
取消对单词含义的获取，仅获取单词本身 |
成功 |
后端
| bug 概述 |
修复过程 |
修复结果 |
| 计算形近词表时用时过长 |
添加哈希索引 |
在较短时间内计算出所需词表 |
| 计算形近词表时返回了一些并不形近的词 |
相同哈希值不足以判断，使用 difflib 进一步判断单词间的相似性 |
大部分单词较为相似 |
| 随机生成在过大压力下速度过慢 |
删除了冗余计算内容 |
所有生成模式都有了较高的生成速度 |
| http 交互存在一定安全隐患 |
实现 https 协议的重定向，并申请相应 CA 证书 |
用户可更加安全地设置密码、访问数据 |
| 后端原静态资源需通过 Django 进行请求得到，效率较低，且在生产模式下无法正常运作 |
通过 nginx 实现动静资源分离 |
生产模式下高效正常运作 |
| IP 地址采用点分十进制表示，不利于用户记忆 |
完成备案申请 |
可以通过域名 jqkey.xyz 进行访问。 |
场景测试
| 用户信息 |
用户情况 |
| 姓名 |
田旭尧 |
| 身份 |
可怜高中生，高考近在眼前 |
| 使用动机 |
高考英语单词必须得全部背过呀 |
| 典型场景 |
每周末在家抽出 3~4h 专门背单词 |
| 用户偏好 |
使用整块的时间系统化背单词，且对每个单词的掌握程度要求高 |
| 用户痛点 |
碎片化的背单词法不适用于一直坐着学习的高考党；纸质书籍笨重，没有交互；天天看书看得好累，要是有更 fashion 的学习方式换换脑子就好了 |
| 预期使用场景 |
每天有固定的时间使用该软件来背单词，通过设置词图中单词的个数激励自己每天的背词数量，并且根据统计信息界面的艾宾浩斯曲线来进行复习。 |
| 实现该用户需求的功能 |
1. 可以设置每个词图的单词数量上限，帮助用户达到每天的学习目标（痛点 1） 2. 统计信息界面对遗忘程度进行展示，时刻关注还未掌握的单词，掌握学习进度（痛点 2） 3. 复习模式帮助用户针对词图单位进行复习，还可以进行拼写测试 |
| 用户信息 |
用户情况 |
| 姓名 |
田昶舜 |
| 身份 |
某校非英语专业大二学生 |
| 使用动机 |
英语不太好，想多背一些单词冲刺四六级，但是没有什么动力 |
| 典型场景1 |
在宿舍突然想背单词，打开 APP 使用一些背词功能 |
| 典型场景2 |
在食堂，饭太烫闲着无聊没事干，背几个单词 |
| 用户偏好 |
几乎不背单词，或偶尔零碎地背单词（非主要受众） |
| 用户痛点 |
不知道怎么复习/背单词，想要短时高收入 |
| 预期使用场景 |
偶尔在四六级之前较为系统地背一些单词 |
| 实现该用户需求的功能 |
1. 可以自定义词图背景，挑一些喜欢的图片记忆单词，趣味性 2. 通过用户社区功能，查看他人优秀的词图和背景，激励自己；还可以点赞、fork（bai piao） 别人的优秀词图 |
| 用户信息 |
用户情况 |
| 姓名 |
田昶禹 |
| 身份 |
某校考研党，英语单词量不高，需要大量提升 |
| 使用动机 |
想要在半年里把考研单词记熟，每天抽出一定时间专门背单词 |
| 典型场景1 |
复习数一数二腻了，背背单词学学英语换换脑子 |
| 典型场景2 |
突然被某篇鸡汤激励到，立誓背完考研单词，然后背了五分钟 |
| 用户偏好 |
偶尔会专门背记单词，主要时间不会用太多，但会用系统化的时间专门记忆单词 |
| 用户痛点 |
单词量较大，碎片化背单词过于低效；且容易注意力不集中、记忆不长久 |
| 预期使用场景 |
由于大学时间比较自由，因此需要依靠激励机制来鼓励自己每天进行背单词。获得激励之后，每天确定背词小目标并完成。 |
| 实现该用户需求的功能 |
1. 日历图展示打卡情况，饼状图展示背词进度，状态统计展示背词曲线，激励用户每天进行单词学习（典型场景 2） 2. 我的词图界面可以预览每个词图的背诵进度条，激励用户消除红色、橙色的部分，让整个词图进度条都呈现美丽的绿色 |
| 用户信息 |
用户情况 |
| 姓名 |
田永晓 |
| 身份 |
某校英语专业或出锅留学生 |
| 使用动机 |
有大量背单词的需求，常啃红宝书等词书，普通的碎片化记忆模式 APP 不适合了 |
| 典型场景1 |
某一天要背好多单词，不想背着一大摞书去图书馆，硬啃，普通的背单词软件过于碎片化，满足不了需求 |
| 典型场景2 |
看了个英文电影，想把电影里整理出来的单词加入候选背单词列表中 |
| 用户偏好 |
系统化背单词，即专门抽出时间阅读书籍、影视并记忆有关单词 |
| 用户痛点 |
纸质书籍重且较不方便、没有交互；大量学习中产生的零散单词除了手写记录难以集中背诵，且无法自定义位置；希望能提供基于词根词缀、近反义词的推荐背诵词 |
| 预期使用场景 |
对单词的专业性和难度有独特的要求，且由于背单词的重要性，需要使用特殊技巧来增强单词记忆。每天需要背单词的时间很长，觉得枯燥乏味难以集中精力。但是词图的多样化编辑功能可以让用户设计属于自己的词图，在背单词的过程中加入设计环节，帮助用户记忆的同时增加趣味性，让用户可以长时间背单词并减少疲劳感。 |
| 实现该用户需求的功能 |
1. 提供随机生成、顺序生成、词根词缀、近反义词、形近词汇、同类词汇等多种生成推荐词表方式，供用户建立词根词缀的概念及联想记忆（痛点 3） 2. 画布的 zoom 功能、可拖拽功能提供极大的操作空间（痛点 1、2） 3. 支持 9 种词书的选择（痛点 1） 4. 工具栏可以设置每个单词的样式 5. 提供自定义加词功能，对于突然联想到的单词可以随时加入词图中 |
压力测试
由于 Beta 阶段添加的 API 大部分为较小量级的 API，于是返回长度最长的 API 仍旧为查看统计信息 API。
Beta 阶段添加了对于形近词、同类词的支持，获得新词表的 API 使用复杂度略高于其他 API 的算法。故使用获得新词表的 API 进行测试，词图大小设置为 50。
另外，使用了静态资源分离和图床策略，对于相对而言大小较大的背景图片不再从服务器直接通过 API 获取，故在此不进行压力测试。
老用户的统计信息的数据量仍然很大，受服务器条件限制，成功率同 Alpha 阶段类似：
| API |
用户数 |
时间 |
业务数 |
成功率 |
传输效率 |
总数据传输 |
响应时间 |
实际最高并发连接数 |
最长传输时间 |
最短传输时间 |
| 查看统计信息 |
255 |
60s |
89 |
26% |
1.50trans/s |
1.73M |
16.33s |
24.53 |
30.01s |
0.82s |
| 查看统计信息 |
255 |
30s |
92 |
100% |
3.09trans/s |
1.79M |
15.85s |
48.96 |
29.73s |
0.00s |
| 获得形近词表 |
255 |
60s |
892 |
100% |
14.91trans/s |
0.05M |
14.64s |
218.21 |
28.42s |
0.46s |
| 获得同类词表 |
255 |
60s |
1155 |
100% |
19.36trans/s |
0.07M |
11.61s |
224.79 |
25.11s |
0.30s |
获得形近词表的 API 对于哈希值计算开销较大，在添加哈希索引前最短传输时间达到了 3s 以上，添加哈希索引后仍旧有 0.46s 较高的延时。相较而言，获得同类词表查询次数就更少一些，效率也更高。
同时，对于其他情况进行压力测试，首先对随机生成进行测试，这里词图大小也是 50：
| API |
用户数 |
时间 |
业务数 |
成功率 |
传输效率 |
总数据传输 |
响应时间 |
实际最高并发连接数 |
最长传输时间 |
最短传输时间 |
| 获得随机词表 |
255 |
60s |
86 |
26% |
1.44trans/s |
0.09M |
16.33s |
57.80 |
30.01s |
0.44s |
仔细查看代码发现，是多种生成方式叠加的时候产生了计算冗余。去除计算冗余之后，进行压力测试：
| API |
用户数 |
时间 |
业务数 |
成功率 |
传输效率 |
总数据传输 |
响应时间 |
实际最高并发连接数 |
最长传输时间 |
最短传输时间 |
| 获得顺序词表 |
255 |
60s |
1196 |
100% |
19.93trans/s |
0.72M |
11.18s |
222.87 |
23.12s |
0.46s |
| 获得随机词表 |
255 |
60s |
1198 |
100% |
19.99trans/s |
0.71M |
11.18s |
223.37 |
25.28s |
0.19s |
| 获得近义词表 |
255 |
60s |
608 |
94% |
10.17trans/s |
0.35M |
17.76s |
180.60 |
30.00s |
0.24s |
| 获得词根词表 |
255 |
60s |
1177 |
100% |
19.67trans/s |
0.74M |
11.55s |
227.12 |
24.52s |
0.30s |
产生近义词表的生成方式对于数据量要求较大，故资源消耗较高；总体来看，对压力适应性较好。
单元测试
后端进行了 API 的单元测试，覆盖率 70%。
没有达到较高覆盖率的原因有三：
- 使用双重校验，每一个 API 都使用解析 token 和解析用户两步进行，保证了用户隐私的安全性，但同时难以构造测试用例对于能够通过 token 解析但是通不过用户解析的场景，故每一个 API 都无法测试这一点；
- 部分 API 使用与其他 API 类似的结构，仅更改了部分影响内容（如修改字体、修改大小等），对于此类问题由于时间限制等原因没有进行完备的测试；
- 对于登陆和注销有关权限 API，进行了较为完备的场景测试，没有进行单元测试。
测试矩阵
为了着重展示 Beta 阶段功能测试结构，将 Alpha 阶段各功能的回归测试结果汇总为 Alpha 阶段功能 一条展示。
| 浏览器 |
版本 |
Alpha阶段功能 |
我的词图 |
个人设置 |
分享社区 |
修改词图背景 |
自定义加词 |
测试模块 |
统计信息 |
| Google Chrome |
90.0.4430.93 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
| Microsoft Edge |
90.0.818.56 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
| 360浏览器 |
13.0.2220.0 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
| Firefox |
88.0.1 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
| Safari（平板） |
604.1 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
| QQ浏览器（平板） |
11.4.8.4762 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
正常 |
UI和操作测试
| 浏览器 |
屏幕分辨率 |
基本功能 |
页面布局 |
操作流畅度 |
| Chrome 90.0.4430.93 |
1920*1080 |
正常 |
正常 |
比较流畅 |
| Edge 90.0.818.56 |
1920*1080 |
正常 |
正常 |
流畅 |
| Edge 90.0.818.56 |
2560*1440 |
正常 |
正常，侧边栏略窄 |
流畅 |
| Chrome 90.0.4430.93 |
2560*1440 |
正常 |
正常，侧边栏略窄 |
流畅 |
| Firefox 88.0.1 |
2560*1440 |
正常 |
正常，侧边栏略窄 |
流畅 |
| Firefox 83.0 |
1920*1080 |
正常 |
正常 |
比较流畅 |
| 360安全浏览器 13.1.1302.0 |
1920*1080 |
正常 |
正常 |
比较流畅 |
出口条件
前端
| 要求 |
完成情况 |
完成度打分（满分10分） |
| 整体 UI 美观 |
对包括字体在内的ui元素进行了进一步优化，对我的词图界面、词图添加了过渡动画 |
9 |
| 教程清晰 |
保留gif教程界面。另外添加基于状态机的引导性教程指引。 |
9 |
| 用户操作顺滑 |
对键盘的监听顺滑，用户对词图的编辑顺滑，过渡动画顺滑，添加缓存减少平均请求时间。但由于系统承载力原因，单张图片上传较慢，api获取词图背景较慢 |
8 |
| 词图功能完善 |
已完成对词图背景自定义、自定义加词等功能的完善，用户对词图的可编辑程度已基本达到最高等级 |
9 |
| 用户记忆状态展现详尽、可读性高 |
统计信息界面新增各词书背诵比例和整体单词状态的示意图，丰富用户可查看的信息 |
8 |
| 充分利用PC端的优势，和手机端相比有强大的不可替代性 |
词图可以通过zoom、拖拽等方式无限放大，充分利用大屏优势。复习测试部分充分利用pc端键盘优势，让用户可以用打字的方式巩固记忆。 |
9 |
| 进行部分要求审查 |
完善对用户名、密码、词图单词数量、词图名称等基本限制的前端审查，进行用户权限管理。 |
8 |
| 各屏幕分遍率、放大缩小、分屏的兼容 |
词图尺寸跟随屏幕和侧边栏尺寸进行自适应，导航栏根据屏幕自适应为底部导航栏。侧边栏不随设备分辨率而出现、消失。 |
7 |
后端
| 要求 |
完成情况 |
完成度打分（满分10分） |
| 数据库设计完备 |
能够支持前端询问，同时支持推荐算法、测试算法、用户使用信息记录的数据库设计 |
9 |
| 进行权限处理 |
用户登录获得密钥，进而才可使用各种功能，保证数据安全性 |
9 |
| 进行邮箱验证 |
用户需要通过邮箱验证才可使用软件，减少恶意用户 |
8 |
| 单词数据 |
770570 个单词，覆盖面较广；其中 20651 个单词具有中英文例句 |
9 |
| 词书数据 |
导入了四级、六级、专业四八级、考研、雅思、托福、GRE、MBA、红宝书等词书 |
8 |
| 近反义词等推荐算法 |
共有 5060 个单词可进行近反义词推荐；共有 9326 个单词可进行同词根词缀推荐；可以进行形近单词推荐；可以进行同类单词推荐；推荐算法自由选择 |
9 |
综上，基本完成 Beta 阶段的出口要求。
