上次讲了websoket的基础知识和应用插件，今天我们来用websocket来实现一个聊天程序。先看几张界面截图： 可以看到，该聊天室主要分为三个部分：消息实时推送，聊天界面与交互实现，用户认证模块。下面讲讲这个3个模块的实现方式。 该部分主要分为用户列表，用户交互，消息展示三…

这里有很多方案，例如我们常说的webpack利用splitchunks进行拆包配合一些加载方式，使原本特别大的appjs分成若干个细小的包，webpack优化将会在下一期的专题里讲到。 webp，是一种同时提供了有损压缩与无损压缩（可逆压缩）的图片文件格式，无损压缩后的WebP…

现在，使用 vue 技术栈的同学有福利啦。大家不需要再重复上述操作了，使用 v-img 组件，就可以解决上述烦恼。 你不需要掌握图片优化技巧、下载各种图片压缩工具，也不需要考虑 webp 的兼容性，也不用再去找懒加载的类库，这一切组件都帮你做了。 说得这么神奇，到底效果如何，我…

无论是在工作中，还是在面试中，web前端性能的优化都是很重要的，那么我们进行优化需要从哪些方面入手呢？本文将遵循yahoo前端性能团队总结的34条黄金定律，哦不，现在是35条了。 1.减少HTTP请求次数。 减少页面的HTTP请求数是个起点，这是提升站点首次访问速度的重要指导原…

一个大视频的背景，如果做的好，会是一个绝佳的体验！但是，在首页添加一个视频并不仅仅是随便找个人，然后加个 25mb 的视频，那会让你的所有的性能优化都付之一炬。

随着移动互联网的发展，用户对产品的使用体验要求越来越高。H5作为业务的重要载体，在移动端的应用非常广泛，因此H5页面性能是一个非常核心的用户体验指标。 本文结合【饿了么首屏优化实践】为大家介绍页面性能优化的思路。 性能优化的首要基础是数据和指标。没有正确的数据和指标指引，优化思…

性能优化是所有前端人的追求，在这条路上，方法多种多样。这篇文章，说一下可以怎样定义性能指标及上报。 FP，全称 First Paint，翻译为首次绘制,是时间线上的第一个时间点，它代表网页的第一个像素渲染到屏幕上所用时间，也就是页面在屏幕上首次发生视觉变化的时间。 通过perf…