作为一名日常靠 Web 技术吃饭的前端工程师,针对性地补充下我的所见所想,或许可以作个参考。
感觉 JavaScript 和 Web 本身的历史包袱都非常重,最初它只是一个表达“文档”的格式,从 Ajax 到 Flash 插件为代表的 RIA 再到 HTML 5,大大拓宽了它的应用场景,也因为它足够兼容并包,所以也赢得了众多的用户。这方面我感觉关注点可以尽量放在那些比较核心的语言特性上,一些过时的资料不必花太多时间。那些类似“回字的 n 种写法”的骚操作就不用太理会,在实际项目中慢慢培养一些肌肉记忆即可。当然我们也可以从这个技术发展的历程去切入,然后从中学到一些东西。
目光放到现代 JavaScript 和 Web APP 场景,JSX/TSX 可以理解为一个 JS/TS 包装的语法糖,用 HTML 的写法包装了一些创建 Node
的函数(React.createElement(xxx)
/ jsx(xxx)
),让 UI 相关的组件树描述起来更加一目了然,减小大脑的认知负担。同理,HTML 本身语法倒是不用太刻意去学习,其实不过是一个有更强容错能力的 XML 文档(以及对应的 Parser 和 Spec 标准),关注点可以放在它所描述的 DOM 树,另外可能还需要关注下语义化和无障碍的适配,主要面向搜索引擎和视障人士。
CSS 的话关键也同样不在语法上,更多在于一个盒子模型和各种各样的布局模式,通常来说,只要熟悉基本的 盒子模型,还有 flex 布局就能画出大部分的界面。tailwind css 的优势在于,节省了很多起 class 名的时间,大部分场景下在写 inline css 和单独抽 class 之间取得了一个比较微妙的平衡,可以做个很好的辅助。
另外,最近几年 Web 的历史潮流发展确实都贼快,因为商业等缘故,Web 技术承载了更重的需求,因此也诞生了更多的 API 、框架类库。我感觉心态上可以稍作转变,某种意义上来说,其实也代表 Web 方向的一种生机和活力。
个人的精力是一定有限的,以一个“穷尽所有”的姿态去面对,肯定学不完,且容易让自己越来越流于浅层次焦虑 (然后导向各类韭菜知识星球),可以适当地放下类似的完美主义执念,找找自己在体系中的定位,然后关注能为自己所用的部分就可。
近两年相关技术有些收敛趋势,总体大概几点:
- 语言:写的话,走 TypeScript 不用说,JS 可以当作一个「编译后产物」来看待
- Web App:React 函数式组件、Hooks 为代表的开发范式,类似 Solid.JS、Vue 3.0,乃至 Flutter 都有类似影子,另外 Desktop / Mobile App 也逐渐依赖 Web 相关技术(Electron / React Native),因此很多原本只在客户端领域流行的东西(自动化测试之类的),也会对应在 JS 语言生态下完善
- Web 站点:逐渐收敛至 Jamstack,在 Web App / 文档 的基础上,通过框架封装了部分 “服务端生成 HTML” 的逻辑(类似于 PHP,但统一用 JS 来写,让 Web 开发的关注点和精力上都可以收敛起来),此时开发者可以专注在 Web 与 人 / 搜索引擎爬虫 的交互层,后端可以根据业务实现灵活处理,进一步对应的是类似 Vercel、Netlify 这样的云服务商
- 更丰富的 Web API:更核心的是扎实的操作系统、网络、乃至于汇编、图形等相关知识,无论浏览器、Node.js 还是 Deno 都属于一种操作系统能力在 JavaScript / TypeScript 语言环境下的一个封装,万变不离其宗(例子:浏览器上跑的Linux 内核 - WebVM,浏览器直接跑 Node.js 环境,甚至 还能跑 PHP 和 WordPress)
- build tools:打包方面已很成熟(主要 webpack / rollup,新的工具更多在比拼速度),主要趋势在开发体验的优化上,基于现代浏览器普及以后,直接让浏览器加载 ES Module,缩短等待时间,提升开发效率(Vite)。作为应用开发者而言,这东西通常不用过分关注,大概了解一些核心概念,用就可以。
ps: shell script 还可以用 google 家的 zx 来搞(之前也有 记录),兼具 JS 的灵活和 shell 的 一把梭哈