React 19 公测版升级完全指南：破坏性更改
给前端以福利，给编程以复利。大家好，我是大家的林语冰。 React 团队爆料最新主版本升级 React 19 Beta（公测版）已经正式上线 npm，想要提前沉浸式体验最新版本的 React 发烧友可以深度阅读这份 React 官方博客的升级指南。 React 19 中新增的改进需要某些破坏性更改，但预计这些变更不会影响大多数应用程序。 在这篇 React 官方博客中，我们将指导你将库升级到 React 19 beta（公测版）的完整步...
使用 WebCodec 在浏览器解码视频、抓帧截图、转GIF
在浏览器内将视频转GIF，无需上传，速度飞快 ✨ 已上线 使用 ffmpeg 生成高质量GIF，全是技巧和折磨 上周五写一个材料的时候，需要插入几个 GIF 演示动图。一开始我熟练的打开终端，使用了我这段祖传 ffmpeg 生成高质量 GIF 的命令： 但是转换过程不太顺利，因为输出的 GIF 文件太大了，我不得不去精细地调整参数，把各种骚操作都尝试一遍，包括但不限于： 剪辑视频：在 前插入想要的时间范围 调整分辨率： 表示宽度 320...
再遇协同编辑：Yjs + Quill，文档协同编辑竟如此简单
通过上一篇文章 ，相信各位小伙伴对 OT 和 CRDT 协同算法有了一定的了解，并且对 Yjs 有了初步的认识，本文主要教会大家如何使用 Yjs 来实现 Quill 的协同编辑，以及针对 Yjs 的一些重要概念进行讲解。 因为协作需要服务端的支持，所有没有 demo，具体实现请 。 Yjs 介绍 官方介绍： 用于构建 Google Docs 和 Figma 等协作应用程序的模块化构建块 。 基于 CRDT ，帮助实现高性能的协作应用程序...
浏览器画中画
作者GitHub： 有兴趣可关注！！！ 尽管效果可以，但是api兼容性不理想🤦 安全上下文 ：此功能仅在安全上下文（HTTPS）中可用，在某些或所有支持的浏览器中。 Document Picture in Picture API（文档画中画API） 文档画中画API（pip api）可以打开一个始终在顶部的窗口， 该窗口可以填充任意HTML内容 ，它扩展了早期的 画中画API，专门支持将HTML 元素放入始终在顶部的窗口中。 兼容性...
浮动与BFC容器
浮动布局是面试中的一个考点，且大多数面试官在考你css时，问的最多的知识点就是浮动，所以我们不仅要会用浮动去布置页面，还要深入理解其原因，知其然，又要知其所以然，只有这样，你才能在面试官面前如鱼得水般的谈笑自如。下面我会引导你去理解浮动布局究竟有啥知识点和细节需要去理解和注意。 1\. 实现文字环绕效果和脱离文档流 在以前的网站上，有着这么一种典型布局方式（文字环绕图片），如图： 你写着写着，突然想插入一张图片，然后图片后面继续写字，这...
深入理解前端性能优化：图片懒加载实践
在当今的前端开发领域，网站性能优化是一个永恒的主题。性能优化不仅关乎用户体验，也直接影响到网站的搜索引擎排名。其中，图片加载优化是提升页面加载速度的重要手段之一。本文将深入探讨一种常用的图片优化技术——图片懒加载的原理和实现方法。 什么是图片懒加载？ 图片懒加载是一种常用的网页性能优化技术，其基本思想是延迟非可视区域图片的加载时间。换句话说，只有当用户滚动到页面的某个区域，位于该区域的图片才开始加载。这样不仅减少了无谓的网络资源请求，还...
[Android] Android开发中dip，dpi，density，px等详解
Px （Pixel像素） 也称为图像元素，是作为图像构成的基本单元，单个像素的大小并不固定，跟随屏幕大小和像素数量的关系变化（屏幕越大，像素越低，单个像素越大，反之亦然）。所以在使用像素作为设计单位时，在不同的设备上可能会有缩放或拉伸的情况。 Resolution（分辨率） 是指屏幕的垂直和水平方向的像素数量，如果分辨率是 1920\ 1080 ，那就是垂直方向有 1920 个像素，水平方向有 1080 个像素。 Dpi（...
TS系列篇｜类(class)
"不畏惧，不将就，未来的日子好好努力"——大家好！我是小芝麻😄 类（Class）定义了一件事物的抽象特点，包含它的属性和方法 1、定义类 在 中，我们也是通过 关键字来定义一个类, 使用 定义构造函数。 构造函数: constructor 主要用于初始化类的成员变量属性 类的对象创建时自动调用执行 没有返回值 2、类的继承 使用 关键字实现继承，子类中使用 关键字来调用父类的构造函数和方法。 子类继承父类后子类的实例就拥有了父类中的属...
一文读懂屏幕尺寸、分辨率、PPI、设备独立像素、Retina
这是我参与8月更文挑战的第1天，活动详情查看： 当我们介绍一个设备的屏幕时，我们会怎么描述呢。除了说很大很细腻之外，还有更精确的概念吗。 以上是从苹果官网截取的对iPhone 12 的屏幕描述。可以看到主要有 尺寸、像素分辨率、ppi 这三个词。他们分别是什么含义呢。下面我们一一解读。 屏幕尺寸 屏幕尺寸大小是用户非常关键的一个指标。如上所示，苹果官网在最明显的位置标明了各个机型的屏幕尺寸。屏幕尺寸一般用屏幕对角线的物理长度表示，单位为...