WEB 前端工程师 / 产品实践

前端工程与产品实践

围绕前端基础、工程实践和体验优化,把复杂技术问题拆成容易理解、可以落地的解决方案。

技术方向
Vue 3 + TypeScript
内容结构
问题 → 原因 → 方案
阅读方式
白话解释 + 示例代码
3内容分类

内容统一整合为基础原理、工程实践和体验优化三个方向。

12问题专题

每个专题都包含问题、原因、解决方案、小白解释和相关示例。

8实用工具

集中提供网络、域名、调试、兼容性和安全检测等常用入口。

核心能力

肥猫的拿手活,不止会写代码

肥猫更在意技术背后的判断:哪里该克制,哪里该加戏,哪里必须稳,哪里值得慢慢磨。

首屏判断

快、稳、先给重点

先确定用户第一眼必须理解的内容,再安排资源、布局与视觉节奏。

查看能力详情 →

组件拆解

结构清楚,边界干净

把复杂界面拆成可维护模块,让业务变化不牵一发动全身。

查看能力详情 →

类型意识

少靠猜,多靠约束

用 TypeScript 和数据约定让错误尽量在开发阶段暴露。

查看能力详情 →

动效编排

有节奏,不喧宾夺主

用动效解释层级、方向和反馈,而不是单纯制造热闹。

查看能力详情 →

工程手感

改得快,也守得住

兼顾开发反馈、构建稳定、目录组织和长期迭代成本。

查看能力详情 →

体验收口

SEO / A11y / Responsive

把移动端、语义结构、搜索呈现与细节反馈一起收紧。

查看能力详情 →

内容方向

前端实践与技术判断

从首屏性能、交互动效和移动体验,到组件边界、鉴权流程与 Nuxt SSR,记录真实项目里值得反复推敲的工程问题。

体验优化

首屏为什么要先讲重点

从内容顺序、关键资源和用户决策三个角度,建立首屏判断方法。

阅读全文
体验优化

滚动叙事怎样才不油腻

控制动画目的、节奏和触发方式,让滚动动效真正帮助阅读。

阅读全文
体验优化

移动端界面要照顾拇指

从触控目标、导航结构和信息密度出发,重新设计移动端体验。

阅读全文
工程实践

复杂业务组件应该怎样拆

从状态归属、变化频率和复用成本判断组件边界。

阅读全文
工程实践

Token 刷新与请求队列怎么处理

梳理登录失效、并发刷新、请求挂起和重试的完整流程。

阅读全文
工程实践

Nuxt SSR 数据请求的边界

区分服务端数据、客户端登录态和只在浏览器运行的交互逻辑。

阅读全文
基础原理

JavaScript 事件循环到底怎么运行

用任务队列解释同步代码、Promise 和定时器的执行顺序。

阅读全文
基础原理

Vue 3 响应式为什么能自动更新页面

从 ref、reactive、依赖收集和更新触发理解 Vue 响应式。

阅读全文
基础原理

Flex 和 Grid 应该怎么选

通过一维与二维布局场景,理解常见页面布局方案。

阅读全文
基础原理

浏览器缓存为什么有时不更新

理解强缓存、协商缓存和资源指纹,避免上线后仍看到旧文件。

阅读全文
体验优化

前端性能优化应该先看什么

从网络、渲染、图片和 JavaScript 四个方向建立排查顺序。

阅读全文
工程实践

Git 团队协作的基本流程

从分支、提交、合并和冲突处理建立可追踪的协作习惯。

阅读全文

个人简介

肥猫 / Fei Mao

这里会持续沉淀前端技术判断:哪些值得试,哪些适合等等,哪些能真正改善用户看到的那一屏。

肥猫标签稳准细

技术路径

技术路径

2024

先把审美立住

肥猫先定下页面气质:克制、有层次、能扫描,也能留下记忆点。

2025

再把细节磨顺

让语言、主题、按钮、卡片和反馈都服务于阅读,而不是打断阅读。

2026

最后沉淀判断

把近期前端变化整理成雷达和路线,不追热闹,只看能不能落地。