前端团队代码评审 CheckList 清单

前端团队代码评审 CheckList 清单前言前端团队有评审代码的要求,但由于每个开发人员的水平不同,技术关注点不同,所以对代码评审的关注点不同,为了保证代码质量,团队代码风格统一,特此拟定一份《前端团队代码评审 CheckList 清单》,这样代码评审人员在评审代码时,可以参照这份清单,对代码进行评审。从而辅助整个团队提高代码质量、统一代码规范。如果你的团队还没有这么一份代码评审 CheckList 清单,也许这正是你需要的;如果你的团队已经有了代码评审参照标准,这份清单也许能起到锦上添花的效果。一、代码静态检查工具1、使用 eslint 工具对 javascript 代码进行检查检查的规范继承自 eslint-config-standard 检验规则,具体的规则介绍参照链接:https://cn.eslint.org/docs/rules/ ,这里及以下部分不再重复介绍这些检验规则。2、使用 stylelint 工具对 css 样式代码进行检查检查的规范继承自 stylelint-config-standard 检验规则,具体的规则介绍参照链接:https://www.npm...

前端优化

Object.freeze这算是一个性能优化的小技巧吧。在我们遇到一些 big data的业务场景,它就很有用了。尤其是做管理后台的时候,经常会有一些超大数据量的 table,或者一个含有 n 多数据的图表,这种数据量很大的东西使用起来最明显的感受就是卡。但其实很多时候其实这些数据其实并不需要响应式变化,这时候你就可以使用 Object.freeze 方法了,它可以冻结一个对象(注意它不并是 vue 特有的 api)。 当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项,Vue 将遍历此对象所有的属性,并使用 Object.defineProperty 把这些属性全部转为 getter/setter,它们让 Vue 能进行追踪依赖,在属性被访问和修改时通知变化。 使用了 Object.freeze 之后,不仅可以减少 observer 的开销,还能减少不少内存开销。相关 issue。 使用方式:this.item = Object.freeze(Object.assign({}, this.item)) 这里我提供了一个在线测速 demo,点我。 通...

Oxygen Music

2019.04.24 更新朋友界面,同网易云朋友栏目,更多内容虚登录, 2019.04.25 优化朋友栏目,增加验证码登录功能,

Oxygen Music 2019-03-05更新

Oxygen Music(2019-03-05更新!)目前支持使用手机号及userID登录,获取网易云喜欢的音乐,歌单

OxygenMusic

Oxygen Music基于vue.js的音乐播放器,资源来至网易云音乐Demo:https://yun.yang143.cn本项目为移动端项目,pc端按F12调为手机模式查看,推荐使用手机查看,扫一扫二维码即可体验目标功能[x] 音乐播放、暂停 -- 完成[x] 播放列表、添加到播放列表、清空播放列表 -- 完成[x] 榜单 -- 完成[x] 歌手Top100、歌手详情页面 -- 完成[x] 搜索单曲、歌手、专辑 -- 完成[x] 热门搜索、搜索历史记录 -- 完成[x] 首页推荐(歌曲、歌单) -- 完成[x] 歌单 -- 完成[x] 我的收藏(歌单,歌手) -- 完成[x] 最近播放 -- 完成[ ] 歌词[ ] 搜索结果分类显示[ ] 切换播放模式[ ] 喜欢音乐[ ] 发现页面[ ] 侧边弹窗功能特性本项目所有数据来源网易云音乐,使用开源项目(NeteaseCloudMusicApi 网易云音乐 NodeJS 版 API)网易云音乐16个音乐排行榜网易新歌速递网易精选歌单,最新歌单本地收藏歌单,歌手,随时查看本地存储最近播放,最大存储99首,超过自动删除最早播放的歌曲搜...

Vue-wechat(2018/12/10)

Vue+axios+muse-ui+vue-lazyloaddemo: https://blog.yang143.cn/视频演示: https://yun.yang143.cn/s/tf59vamvGithub: https://github.com/Jonathan143/vue-wechat主要特性界面布局大致模仿微信聊天页面,自动回复调用一言API聊天页面聊天记录采用 localstorage 存储;我的栏目里的相册里的图片均来自干货集中营,调用干货集中营API;使用vue-lazyload插件,实现图片懒加载;朋友圈顶部封面为必应每日美图,每日动态更换;...更新时间2018/12/10 修复聊天界面小bug,添加时间显示,1分钟间隔,超过1分钟发消息,动态添加时间模块,时间当前发消息时间;2018/12/09 更新,支持聊天回复,聊天回复调用一言api接口,聊天记录采用localstorage存储;2018/11/28 上传至 github2018/11/08 初建项目效果图鸣谢Vue.jsaxiosvue-lazyloadsassMuse-uihitokoto - ...

Vue项目(一)

项目地址vue做的是手机端,电脑请F12切换手机模式访问基于vue+axios+vuex+Vant组件库瞎jb乱写的,好多功能没有实现,布局看心情...功能看心情...(也没啥功能...)演示视频地址(可在线预览)https://yun.yang143.cn/s/dd98ywad新闻和相册里的默认分类是都是静态资源,相册里的美图(福利)调用的是干货集中营的api

vue.js学习(一)

vue.js渐进式JavaScript 框架基本指令v-textv-htmlv-showv-ifv-elsev-else-ifv-forv-onv-bindv-modelv-prev-cloakv-oncev-text详细:更新元素的 textContent。如果要更新部分的 textContent ,需要使用 {{ Mustache }} 插值。示例: {{msg}}v-html详细:更新元素的 innerHTML 。注意:内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译 。如果试图使用 v-html 组合模板,可以重新考虑是否通过使用组件来替代。示例:``v-show用法:根据表达式之真假值,切换元素的 display CSS 属性。当条件变化时该指令触发过渡效果。示例:Hello!v-if用法:根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。如果元素是 ,将提出它的内容作为条件块。当条件变化时该指令触发过渡效果。示例:在字符串模板中,比如 Handlebars,我们得像这样写一个条件块: {{#if ok}} Yes...