huzunjie 发布于 03月24, 2022

如何在网页上低成本实现一个简单的“护眼模式”

先看个效果默认模式:护眼模式:对于需要长时间盯着屏幕同学,后面这个“护眼模式”相对“默认模式”的亮底,应该算是更舒适、不那么容易引起视觉疲劳的一个选择。在当下,作为Web前端开发者,要在网页上添加这么个护眼模式,其实可能并不需要定制化的去针对暗色调写一套完整皮肤样式。最简单的护眼...

阅读全文 »

huzunjie 发布于 11月21, 2021

跨网页或APP数据文件共享续篇

前言我在前面一篇文章《记一个网页端IM文本编辑器的演进过程 (https://blog.pyzy.net/post/editor.html )》虽然没有提到 DataTransfer,但实际也涉及到了从剪切板(clipboardData)或拖拽元素(dataTransfer)来...

阅读全文 »

huzunjie 发布于 05月13, 2021

记一个网页端IM文本编辑器的演进过程

背景前端项目开发中,为用户输入内容提供一个编辑框是非常常见的基础交互需求。比如博客文章下面的评论区、可视化富文本编辑、在线代码编辑器... 根据不同的业务场景,我们应该做怎么样的调研?怎么决定选型?相关技术点又有哪些?基础效果比如某个历史项目里,有下图这么一个编辑器。通过示意可以...

阅读全文 »

huzunjie 发布于 04月01, 2021

我经常和面试者聊的一个题目

本文背景作为一个Web前端从业者,资深B/S架构的应用开发,通常我们负责的内容都是侧重的浏览器端比较多,即便目前Vue、React等各种框架库流行的年代,核心实现也依然是JS API操作DOM;如果资历更深一些的同学,还会熟知jQuery,更是因为各浏览器API不统一作为其解决的...

阅读全文 »

huzunjie 发布于 02月20, 2021

为基于Electron开发的Mac端本地应用启用别名

背景交代最近在做的一个基于Electron开发的Mac端项目,要进行产品更名。但是如果直接修改编译打包后的应用名称,问题会比较大。首先,类似上图里所有缓存资源、以及涉及鉴权的各种Cookie&Storage ,都是存放在类似/Users/huzunjie/Library/...

阅读全文 »

huzunjie 发布于 02月06, 2021

Web前端剪切板文本分享到文件发送

前言  现在前端富交互能力越来越强,也有很多产品基于前端技术进行离线应用开发或在线应用体验增强;这其中剪切板操作也是一个经常会亮相客串的一个基础能力。今天这篇文章我们就一起整理一下关于剪切板读写操作的一些实践。会包含浏览器端、Electron客户端两种不同的业务场景下,一些具体的...

阅读全文 »

huzunjie 发布于 04月26, 2020

Web前端点播直播入门

序言《360前端星计划》由360的前端团队和校园招聘团队合办,面向在校应届大学生,为培养最优秀最有潜力的前端人才举办的前端技术系列培训&人才选拔项目。到今年(2020)已经连续举办6年,也就是第6届了:https://study.qiyun.360.cn/course/f...

阅读全文 »

huzunjie 发布于 04月10, 2020

Web前端HEVC播放器实践剖析

序言前面给360视频云团队围绕HEVC前端播放及解密实现了一套基于WebAssembly、WebWorker的通用模块化Web播放器。在LiveVideoStackCon2019深圳的演讲中对其架构设计、核心原理,具体痛点问题的解决方式进行了详细剖析分享。这里整理为一篇技术文章,...

阅读全文 »

huzunjie 发布于 02月27, 2019

纯CSS实现滚动的DOM边框

有时候,我们的产品交互上需要一些特别的效果,比如一个可编辑区域往往会添加一些动态描边效果,那么下面这个可能不失为一个不错的备选方案。废话不说,直接上效果:代码:<!DOCTYPE html><html><head> <meta char...

阅读全文 »

huzunjie 发布于 06月06, 2018

gifEditor 反馈收集

本文章用于收集 https://gif.pyzy.net/ 的建议和反馈。有任何建议或期望,可以留言,或邮件给 huzunjie@pyzy.net 。 有意打赏我们的GIF编辑器是否长久服务下去,取决于大家的支持和鼓励。如果碰巧帮到你了,可以:...

阅读全文 »