从快照到时间序列：一次实时行情系统的结构演进与架构取舍
从快照到时间序列：一次实时行情系统的结构演进与架构取舍
在多数前端行情系统中，Ticker 快照接口足以支撑列表展示：最新价、涨跌幅、成交量定时刷新即可。
但当系统开始引入 K 线图表后，前端架构会发生一次实质性的结构变化。
这篇文章不讨论某个具体 API 如何调用，而是围绕一次真实的结构升级过程，复盘一个典型行情系 ...
为什么 SVG 能在现代前端中胜出？
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
如果你关注前端图标的发展，会发现一个现象：
过去前端图标主要有三种方案：
PNG 小图（配合雪碧图）
Iconfont
SVG
到了今天，大部分中大型项目都把图标系统全面迁移到 SVG。
无论 React/Vue 项目、新框架（Next/Remix/Nuxt），还是大厂的设计规范（Ant Design、Mate ...
Windows 下 Node.js 重定向输出导致中文乱码的问题分析
根本原因分析仅供参考，都是AI分析的
一、问题描述
在 Windows 环境下执行以下命令时，发现 中文输出出现乱码：
node client.js --code b16fcb6181383533844e5572ca9b56a8 > output.log 2>&1
但如果只重定向标准输出（stdout），则 不会出现乱码：
node client.js --code b16fcb6181383533844e5572ca9b56a8 > output.log
...
普通Fetch和Fetch 流式的区别？
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
你想弄清楚 Fetch 流式的核心定义、工作原理和实际价值，简单来说，Fetch 流式是 Fetch API 提供的「边接收、边处理」数据的能力，它让前端不再需要等待服务端返回完整的响应数据，而是能逐块读取、处理数据，是前端处理大文件、实时数据的核心能力之一。
一、Fetch 流式的 ...
一个月，Vue四件套，专为移动端深度优化的第三方网易云 WebApp
这年代真的很魔幻：物价在涨、黄金在涨，人都在悄悄发福，更别说内存条蒸蒸日上。结果回头一看，音乐软件也跟着 “发福” 到离谱。
就拿网易云来说，十年间安装包膨胀十几倍，从一个纯粹的播放器，硬生生塞成了集直播、K 歌、社区、短视频、商城于一体的 “全能平台”。权限越要越多，体积越更越大，对于性能不怎么好的设备 ...
高德地图-物流路线
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
有些时候我们的项目只使用原生一些内容是无法实现一些功能的，所以今天我带来了一个大家都熟悉的，也是生活中常见的一个功能，也就是大家在网购的时候，下单成功后就可以看到自己的订单，当然也可以查看物流信息，那么物流信息中有一个部分就是地图部分，这部分可以让用户看 ...
前端工程化 - 良好的feature-based-目录结构与具体示例
良好的feature-based-目录结构与具体示例
背景
先拆”业务边界”,不是拆组件
从业务角度来说,这个订单页其实有3个部分:
核心 - 浏览能力
订单列表
基础筛选
分页
Extension - 可选 - 插件能力
高级筛选
导出
状态变更
Detail - 按需能力
订单详情单床
重构目录结构
把 “ 按技术类型” 改为 “按业务角色”
...
vue 甘特图 vxe-gantt 设置每个进度条分为计划和实际两条，实现上下分布任务条
vue 甘特图 vxe-gantt 设置每个进度条分为计划和实际两条，实现上下分布任务条，实现方式是利用子任务的子视图渲染模式，来间每条任务拆分成2条子任务，就可以利用自带的子视图渲染功能来渲染。
https://gantt.vxeui.com
由于放2行超出默认高度，所以还需要通过 cell-config.height设置一下行高，再通过树形表格的子任务来 ...
基于PDF.js的安全PDF预览组件实现：从虚拟滚动到水印渲染
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
基于PDF.js的安全PDF预览组件实现：从虚拟滚动到水印渲染
本文将详细介绍如何基于Mozilla PDF.js实现一个功能完善、安全可靠的PDF预览组件，重点讲解虚拟滚动、双模式渲染、水印实现等核心技术。
前言
在Web应用中实现PDF预览功能是常见需求，尤其是在线教育、文档管理等场 ...
书架效果的实现
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
1. 对齐目标
前端想实现一个类似的书架放置书籍的效果，目标如下：
2. 思路梳理
我们使用的技术栈：vue
实现这样的一个效果，我们需要知道以下信息：
每行可以放置多少书本？
放下所有的书本需要多少行?
需要什么样的数据结构?
我们现在一个个来思考，既然我们选择了vue来 ...
SciChart.js v5版本全新发布：为Web图表开发带来更高效体验
近日，SciChart 官方宣布发布 SciChart.js v5 版本，这是该 JavaScript 图表库系列的重要更新之一。在本次版本升级中，开发团队重点围绕性能优化、图表渲染效率提升和功能扩展等方面进行了改进，为前端数据可视化应用提供更流畅、更灵活的开发体验。
获取SciChart.js新版试用，请联系慧都科技>>>
核心性能提升
...
用户单击文本并复制至剪帖板
Html5网页，一些内容，可以让用户点击选中文本，并把选中的文本复制至剪帖板(Clipboard)。Insus.NET已经实现与测试，记录于此，方便时可以重来查阅与参考。复制文本到剪贴板（兼容所有浏览器）
function CopyTextToClipboard(text) {
// 方法1: 使用现代Clipboard API（首选）
if (navigator.clipboard & ...
uniapp多边形动画
实现效果
使用三角形，四边形等拼成一个爱心的图形。
爱心的图形一段时间会有高光闪过。
点击爱心图形会使拼成一个心字。
实现思路
三角形，四边形可以用clip-path: polygon();画出来，确定几个顶点可以画出任意图形。
高光需要在每个多边形添加动画延迟然后加上统一的动画。
爱心变成心字只需要确定更改后的多边形顶点位 ...
前端实现速度线
功能
前端实现速度线，在矩形内生成黑白三角形且闪动。
思路
速度线可以使用多个角度相同的三角形分解矩形。三角形的渲染使用canvas连线fill就行，三角形在矩形上的两个点可以通过计算每个三角形的边长来获取。三角形在矩形上的边长使用三角函数获取。
HTML结构：包含一个画布（Canvas）用于显示图片。
CSS样式：定义了页 ...
上传图片修改透明边距并下载下来
功能
允许用户上传图片，并在图片周围添加透明边距。用户可以调整边距的大小，然后将修改后的图片下载为PNG格式。
思路
HTML结构：包含一个画布（Canvas）用于显示图片，以及一些输入框和按钮用于调整边距和下载图片。
CSS样式：定义了页面的基本布局和样式，使页面居中显示，并设置了画布的大小和边框。
JavaScript功能： ...
老板：能不能别手动复制路由了？我：写个脚本自动扫描
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
起因
周五快下班，老板过来看权限配置页面。
"这个每次都要手动输路径？"
"对，现在是这样。"我打开给他看：
角色：运营专员
路由路径：[手动输入] /user/list
组件路径：[手动输入] @/views/user/List.vue
"上次运营配错了，/user/list 写成 /user/lists，页面打不开找了 ...
THREE.js 摄像机分享
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
前置代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
html,
body {
margin: 0;
height: 100%;
}
#c ...
面试官：如何解决按钮重复点击？这个问题挂了80%的人！
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
前言
还记得上周我们团队在招聘前端工程师，一个看起来经验丰富的候选人坐在我对面。
"你们项目中是如何处理按钮重复点击的问题的？"我抛出了这个看似简单的问题。
"这个简单，使用防抖就可以了。"他很快回答。
然而，当我继续追问细节时，他却陷入了沉思...
实际上，这个问 ...
利用自定义html元素实现支持实时修改的高亮代码块
利用自定义html元素实现支持实时修改的高亮代码块
代码块高亮是前端开发中常见的需求，尤其是在展示代码片段的博客、文档等场景中。市面上有很多成熟的代码高亮库，比如Highlight.js、Prism.js等，它们都能很好地实现代码高亮功能。
通常的高亮代码块是“静态”的，修改代码内容后需要对DOM元素重新应用高亮样式。由于涉及D ...
这 5 个冷门的 HTML 标签，能让你少写 100 行 JS
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
大家好!😁。
Code Review 的时候，我最怕看到什么？
不是复杂的算法，也不是什么正则。而是明明一个 HTML 标签就能搞定的事，有人非要写几百行 JS + CSS 去重新发明轮子 。
前几天，我看到一个新同学为了写一个折叠面板（Accordion），引入了一个重型的第三方库，还写了一堆 ...
