前端-自由看

累计撰写 271 篇文章
累计创建 42 个标签
累计收到 0 条评论

目录CONTENT

以下是前端相关的文章

2023-02-28
🎨 告别预处理器：CSS 变量（Custom Properties）实战与主题切换 <h2>CSS 变量的革命性意义</h2> <p>CSS 自定义属性（Custom Properties，通常称为 CSS 变量）带来了前所未有的灵活性和动态性，它们是 **原生的、活的** CSS 属性。与 SASS/Less 等预处理器变量不同，CSS 变量可以在运行时被 JavaScript 读取和修改，并受 **CSS 级联规则** 的约束
- 2023-02-28
- 1
- 0
- 0
- 前端
2023-02-14
🖥️ 浏览器渲染机制：从 DOM 树到复合层的关键性能优化点 <h2>理解浏览器的工作流程</h2> <p>前端性能优化需要深入理解浏览器如何将 HTML/CSS/JS 转换为屏幕上的像素。整个渲染流程大致可分为以下关键阶段：</p> <ol> <li>**构建树：** 解析 HTML 生成 **DOM Tree**；解析 CSS 生成 **CSSOM
- 2023-02-14
- 0
- 0
- 0
- 前端
2023-02-01
🐛 跨域调试：解决前端 CORS 错误与配置代理服务器的方案 <h2>CORS：同源策略的安全限制</h2> <p>**跨源资源共享（CORS）** 是浏览器强制执行的同源策略的安全机制。当您的前端应用（如运行在 `localhost:8080`）尝试请求不同域（Domain）、端口或协议的后端 API 时，就会遇到 CORS 错误，请求被浏览器拦截。</p> <h3>解决 CORS
- 2023-02-01
- 0
- 0
- 0
- 前端
2023-01-25
🎨 WebGL/WebGPU 基础：前端如何利用 GPU 实现 3D 渲染和加速计算？ <h2>GPU：浏览器中的性能怪兽</h2> <p>前端不再局限于 2D 界面。**WebGL**（基于 OpenGL ES 2.0）和 **WebGPU**（新一代标准）允许前端直接访问用户的 **GPU**，实现高性能的 3D 图形渲染和通用计算。</p> <h3>WebGL/WebGPU 的价值：</h3>
- 2023-01-25
- 0
- 0
- 0
- 前端
2023-01-15
⚛️ 深度解析：为什么虚拟 DOM 比操作真实 DOM 更高效？ <h2>虚拟 DOM (VDOM) 的工作原理</h2> <p>前端框架如 React 和 Vue 广泛采用 **虚拟 DOM (VDOM)**，这是一个轻量级的 JavaScript 对象，用于表示真实 DOM 的结构和状态。很多人误以为 VDOM 的速度本身快于真实 DOM，但真正的效率提升源于其 **Diff 算法** 和 **批量更新机制*
- 2023-01-15
- 1
- 0
- 0
- 前端
2020-01-06
采用TypeScript提高前端项目的开发效率和代码质量采用TypeScript提高前端项目的开发效率和代码质量 TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，添加了静态类型和其他高级功能。采用 TypeScript 可以显著提高前端项目的开发效率和代码质量，以下是一些优点和技巧： 1. 静态类型检查 Type
- 2020-01-06
- 52
- 0
- 0
- 前端
2018-01-14
使用CSS变量提高样式管理和维护性使用CSS变量提高样式管理和维护性 CSS变量（Custom Properties）是CSS中的一种机制，可以让开发者定义自己的变量，用于存储重复使用的值，从而提高样式管理和维护性。以下是一些使用CSS变量的关键技巧： 1. 定义变量使用 -- 前缀定义变量，例如：
- 2018-01-14
- 35
- 0
- 0
- 前端
2018-01-13
使用CSS动画增强网站交互性使用CSS动画增强网站交互性 CSS动画是一种强大的工具，可以增强网站的交互性，吸引用户的注意力，并提升用户体验。以下是一些使用CSS动画增强网站交互性的关键技巧： 1. 过渡效果利用CSS过渡（transition）效果，为元素的状态变化添加平滑过渡效果，使用户界面更加流畅和自然。 2. 关键帧
- 2018-01-13
- 58
- 0
- 0
- 前端
2018-01-12
如何使用CSS Media Queries创建响应式布局？如何使用CSS Media Queries创建响应式布局？ CSS Media Queries 是一种强大的技术，可以根据设备的特性（如屏幕尺寸、分辨率、方向等）应用不同的样式规则，从而创建响应式布局。以下是一些使用 CSS Media Queries 创建响应式布局的关键技巧： 1. 媒体查询语法
- 2018-01-12
- 55
- 0
- 0
- 前端
2018-01-11
使用CSS Flexbox构建灵活的布局设计使用CSS Flexbox构建灵活的布局设计 CSS Flexbox 是一种强大的布局模型，可用于创建灵活的、响应式的网页布局。以下是一些使用 CSS Flexbox 构建灵活布局设计的关键技巧： 1. 弹性容器与弹性项使用 display: flex; 将元素声明为弹性容器，然后容器内的子元素即
- 2018-01-11
- 41
- 0
- 0
- 前端

1
2
3
4