XCong

基于 clip-path: polygon(x y, x2 y2, x3 y3); 实现碎片化图像的效果。

工作需求：在浏览器网页上播放建筑工地摄像头监控的画面，如工地出入口通道画面、塔吊可视化，并且可兼容不同型号的摄像头设备。 思路非常清晰，下面开始实践。 首先是新建一个项目，配置基础的webpack和babel，并安装websocket相关的两个库 ws、websocket-st…

1、视频和视频流 图片是由像素点组成的图像文件 视频是一系列连续播放的图片 视频流是一种视频数据传输方式 2、常识概念 分辨率：显示器所能显示的像素数量（分辨率越高，图片越清晰） 帧率：1s播放多少帧

依然是这个简单的项目。 由于使用JS+CSS不能实现圆角的效果（如下图，主要使用到了CSS3的transform属性），所以特地研究了一下怎么使用canvas来100%复原设计稿。 第一眼看到canvas相关的API文档时，感觉有点头大：东西实在太多了，想要一下子学会似乎问题不…

项目上有一个播放实时视频（直播）的需求，后端童鞋直接传过来一个类似 https://...️️/live.m3u8的视频流地址。让我自行播放，拿到地址的我一脸懵逼，下面开始我的探索(baidu)之路。 HLS将音频和视频作为一系列小文件发送，通常持续时间约为6秒，称为媒体段文件…

HLS是什么  HLS是HTTP Live Streaming 的缩写，是由苹果公司推出的基于HTTP的能自适应的流媒体传输协议，常用于直播和点播。 HLS 的工作原理是当推流端把视频流推到服务端后，

音视频通话实战与原理，支持内外网，《WebRTC 从实战到未来！》第二篇，迎接风口，前端必学的技术！

拍照，抠图，分享屏幕，录制屏幕，虚拟背景，实时音视频通话，新开了一个专栏《WebRTC 从实战到未来！》

引言在lottie出现之前，前端对动画往往是通过css自己手写。随着动画效果的日益复杂，一些动画效果存在兼容问题不说，有些也是复杂到难以实现，前端er要花很长时间在动效的coding上。lottie-