我从十年前开始写 HTML、CSS 和 JavaScript，我的直观感觉是前端经历了从易到难，又从难到易的过程。

先从前端行业的发展历史来看，前端正在变得越来越成熟。如果和过去相比，之前的前端真是太简单了。十年前正处于前端的石器时代，那时的前端开发用一个词语来形容就是“刀耕火种”。换句话说，那时的前端非常的“原始”。原始到什么程度呢？

前端开发者的噩梦：

  • 兼容 IE6。IE6 发布于 2001 年，而 ES5 直到 2009 年才定稿。IE6 除了可以运行 JavaScript 之外还可以运行 VBScript、JScript（一个 Javascript 的方言）。
  • 当时有一个只能运行于 IE 的技术叫 “ActiveX”，估计大部分新生代前端开发者都没有听说过这个技术。直到目前为止很多银行和政府的网站只能用 IE 浏览器打开，甚至只能使用 IE 的特定版本打开，就是因为 ActiveX。
  • 还有一个技术是目前已经被淘汰的 Flash。

为什么很多技术都觉得前端很简单？

我们现在所说的前端通常这是包括了 HTML、CSS、JavaScript，甚至 Node.js、SVG 等和 Web UI 层相关的开发技术。那么在没有 ES6，没有 HTML5，没有 CSS3 的时代，前端到底是什么样的呢？是不是非常简单呢？确实，当时甚至没有“前端工程师”、“前端开发者”这个词，那时这个岗位被称为“切图师”、“切图仔”。在大部分公司中，HTML 和 CSS 都是由设计师来做，页面中动态效果比如鼠标划过显示菜单、轮播图等则是由后端开发者来完成。后端 JSP、PHP 开发者兼职写 jQuery 是当时的普遍现象。

概括一下此时的“简单”指的是：HTML、CSS、JavaScript 的能力有限，或者浏览器对它们的支持有限，导致前端工程师的发挥场景较小。比如按钮圆角一般都是设计师使用图片来搞定，因为在 CSS3 之前实现按钮的圆角效果是非常困难的。

然而伴随着 HTML5、CSS3、Ajax、ES6 等技术而来的 Web 2.0 则将前端开发变得复杂了。Ajax 显著提升了用户体验，前端开发也从 “Web Page” 时代进入了 “Web App” 时代。之前我们开发的是“网页”，我们开发部署完网站之后，用户是来“看”我的网站的。而 Web 2.0 时代，我们开发的则是“Web 应用”，我们开发部署完网站之后，用户是来”用“我的网站的。而这种 Web App 基本都是单页应用 SPA(Single Page App)，这对前端开发者又带来了新的挑战。前端开发的规模也变得非常大，以前的前端开发基本也就 10 个左右的 JavaScript 文件就搞定了，而在 Web 2.0 时代前端开发少则几十个文件，多则几百几千个。

前端不仅仅是开发规模的变大，随之而来的还有开发难度的变大。之前我们的页面在用户浏览结束后或者切换到新的页面后就会关闭，页面 JavaScript 程序使用的所有内存也会一并释放。而现在我们的 Web App 并不会随着用户的导航而结束，而是一直常驻内存，为了防止 OOM（Out Of Memory）就需要前端开发者考虑 JavaScript 的内存占用，这也正是 JavaScript 程序员一直欠缺的。

另一点就是平台多样化。之前我们写网页的时候一般只需要运行在电脑上，宽度也是固定的 960 像素。而如今的网页不仅仅可以运行在电脑上，还可以运行在其他的各种设备上，比如手机、平板电脑、TV 等设备。不同的设备都有不同的尺寸和分辨率，这对前端开发者的 CSS 布局提出了新的挑战，如何让网页尺寸完美的兼容不同的分辨率和长宽比成为了前端开发者的必备技能。除了像素不同以外，每个设备的内存和 CPU 也不一样，当我们写 JavaScript 的时候不得不为设备内存和 CPU 精心挑选更加合适的 npm 包以达到更优的性能。

随着各个平台小程序的发布，前端开发者们又不能不去适配小程序的开发，我们的网页也脱离了浏览器的限制从而运行在了其他的平台上，同样，我们使用的 JavaScript API 也不再是浏览器提供的 Web API 而是平台提供的特有 API。

为什么很多技术都觉得前端很简单？

如果从前端工具链的角度来看，目前前端也是慢慢变得更加专业，更加复杂了。我们对比一下同时期的后端，各种工具链和技术很早就已经非常成熟了。那早期的前端也只是作为了后端 MVC 架构中的 View 层，在没有前后端分离的时期，View 层也是由前端和后端一起开发的。现在我们开发前端项目都会涉及到打包、压缩、混淆等，而在之前虽然大型前端项目还是少数，当涉及到几百个 js 文件的时候，前端也会使用到打包、压缩、混淆等工具，而这些工具当时几乎都是由 Java 提供的，流行的有雅虎开发的 YUI Compressor、谷歌开发的 Google Closure Compiler。

前端经过这么多年的发展，尤其是 Node.js 出现以后，前端已经变得非常成熟，也变得复杂，而“简单”的时代也已经成为了历史。而 Node.js 不仅拓展了前端的边界，还提升了前端的研发效率。

Node.js 让前端变的更加复杂了，但是随之而来各种前端工具链让前端变得更加强大和简单。从 Prototype 到 jQuery；从 Underscore 到 Lodash；从 Grunt 到 Gulp，再到 Webpack。每一次工具链的变革都让前端开发更加简单。而多端技术的出现则让前端开发者真正的成为了全栈开发者，比如 APICloud 这种平台。前端虽然不简单，但是前端工程师的价值就是用自己的技术提升前端的开发效率，将复杂的前端开发变得简单。

前端的复杂还体现在：

  • 选择生态：你需要在 Vue、React、Angular 等前端框架/库中选择一个方向深入，甚至都得学习——冷不丁又来了些 Sevelet、Web Component 和 Tailwind 等技术，提供一种与众不同的 UI 组件构建方式。
  • 选择工具链：你需要同时学习 Webpack、Babel——又来了大胆抛弃历史遗留问题的 Snowpack 和 Vite，以及大而全的 Rome tool 能让你开箱即用。
  • 构造后端能力：在考虑到同为 JavaScript 更方便学习的情况下，你需要学习 Node.js 来提高后端能力，学学 C++ 来开发 Node 底层库——现在有了 Deno，Go 和 Rust 语言的最新思想及时的被引入了进来，提供一种更安全、高性能的解决方案，让人心动不已；
  • 开发 Web 应用：当你觉得一个 Web 应用开发个前端和后端就可以的时候，Serverless、微服务、低代码/无代码和人工智能等架构持续演进...

为什么很多技术都觉得前端很简单？

现在前端开发者所面临的痛点已经和之前的完全不同了。以前的开发技能经过这么多年的发展已经不再适用。前端逐渐规范的后果就是也淘汰了一大批“古典”前端开发者们。抓住风口的开发者们已经实现了弯道超车。以前我们的痛点是如何兼容 IE6，如果使用不同的 Web API 以便让我们的 JavaScript 代码可以跨浏览器运行，jQuery 的出现就是为了解决这个痛点。

然而现在 jQuery 已经逐渐被边缘化，慢慢的没落了，这也进一步说明 jQuery 曾经解决的那些痛点已经不再是最主要的痛点了。随着浏览器对 Web 标志的支持越来越完善，前端开发者已经可以使用统一的 Web API 去操作 DOM 或者 CSSOM 了，对 jQuery 的依赖也不是那么迫切了。

在 Web 2.0 时代前端开发的痛点则是如何多人协作开发大规模项目、如果在 SPA（Single Page App）中管理复杂的状态等，而 React/Vue/Angular 框架的出现则解决了这些痛点。通过组件化的开发模式解决了多人协作开发和代码复用的问题，通过数据驱动视图的方式让前端开发者彻底和 DOM 解耦，我们在开发网页的时候不必考虑如何操作 DOM，相比 jQuery 的方式，使用 React/Vue 让开发效率又达到了新的高度。

前端的痛点还包括：如何跨多个不同的平台？如何接入第三方 SDK？如何同时运行在 Web、Android、iOS、小程序等平台？…… 对于这些痛点 React/Vue 框架都没有解决，所以就必须由前端开发者自行解决或者寻找一种成熟的结局方案。APICloud 就提供了一站式的解决方案，尤其是 APICloud 3.0 发布后，已从跨平台技术全面升级为多端技术：

APICloud - 低代码开发平台​docs.apicloud.com/apicloud3/?uzchannel=294

  1. 使用 avm.js 一个技术栈可同时开发 Android & iOS 原生 App、小程序和 iOS 轻 App，且多端渲染效果统一；
  2. 全新的 App 引擎 3.0 不依赖 webView，提供百分百的原生渲染，保障 App 性能和体验与原生 App 一致；
  3. 现有 api 直接映射兼容小程序接口，延续已有开发习惯；

APICloud 3.0 让开发者可以一次编码同时开发 Android 和 iOS APP、 小程序、H5 多端应用，一个技术栈覆盖全流程开发。APICloud 3.0 开发的 APP 是完全原生的 APP。Deep Engine 3.0 不依赖 webview，使用全翻译式运行原理实现百分百的原生布局能力，强大的渲染引擎为 APP 提供出色的性能和体验。

APIClound 还开发了 avm 跨端框架。avm 全称 APICloud-View-Model，是一个跨端的高性能 JavaScript框架，更趋近于原生的编程体验。它提供简洁的模型来分离应用的用户界面、业务逻辑和数据模型，适合高度定制化的项目。avm 使用类 Vue 语法和兼容 React JSX，对于 Vue、React 开发者而言，非常容易上手avm，几乎不需要学习成本。

APIClound 不仅仅让 APP 产品体验实现质的飞跃，也注重程序员使用过程中的编码体验。为此 APICloud 团队还开发了云端一体化 IDE 工具：APICloud Studio 3.0 基于业界领先的代码编辑器 - VS Code 深度定制，支持多端开发和调试。数据云 3.0 提供更强大的云端数据库，云端一体化完成全流程开发。APICloud Studio 3.0 为多端开发流程中的每一个环节进行增效，保持和云端打通，在编辑器中即实现创建/导入项目、云编译、自定义 Loader，以及模块管理、论坛互动等操作。

为什么很多技术都觉得前端很简单？

我们看一个使用 avm.js 框架开发的例子(以下代码来自官方示例)：

<template>   
    <view class='header'> 
        <text>{this.data.title}</text> 
    </view>   
</template>   
<script> 
    export default {   
        name: 'api-test', 
        data(){ 
            return { 
                title: 'Hello APP' 
            } 
        } 
    } 
</script> 
<style scoped> 
    .header{ 
        height: 45px; 
    } 
</style>

可以看到语法和 Vue 非常像，因此 Vue 开发者几乎可以直接上手开发。我们再看一个 jsx 的例子：

avm.define('api-test', class extends Component { 
 
    data = { 
        title: 'Hello APP' 
    } 
 
    css(){ 
        return `.header { 
            height: 45 
        }` 
    } 
 
    render() { 
        return ( 
            <view class='header'> 
                <text>{this.data.title}</text> 
            </view> 
        ); 
    } 
});

语法又变得和 React 很相似了。

APICloud Studio 的云编译功能可以让我们直接在云端编译 Android 和 iOS App，我们还可以很方便的使用 Wifi 或者 USB 连接真机进行 UI 预览和代码功能调试。

APICloud 还提供了丰富的云市场，我们可以很方便的接入第三方 SDK，轻松的实现分享、登录、定位、支付、推送等服务。如果不使用 APICloud，则我们每接入一个第三方 SDK 都需要很复杂的流程。

最后我们总结一下：前端开发一点都不简单，那些十年前认为前端非常“简单”的程序员基本都被时代淘汰了，“为研发提效，为业务赋能”。技术驱动提升开发效率是行业发展的价值所在。

如果你想进一步为开发提效，不妨试试 APICloud：

APICloud 手机APP开发、APP制作技术专家 - 国内领先低代码开发平台​www.apicloud.com/为什么很多技术都觉得前端很简单？