。该活动已经组织了近一年时间。有兴趣的可以参加。每周大家学习200行左右的源码，共同进步。同时强烈建议订阅我写的20多篇源码文章。 。另外：目前有江西|湖南|湖北前端群。可以加我微信加我群。

之前有很多朋友问我如何学习前端，如何提高自己的前端开发水平。作为一个非专业出身的前端程序员，我想分享一下我对自学前端的看法。

非专业学生如何快速逆袭，成为独立前端工程师？让我们以我自己的个人经历为例。

我在大学学习的是工业设计相关专业，在工业制造、精益生产、工业产品设计方面有一定的造诣。但我距离前端、后端、运维等互联网领域还很遥远。可以说我格格不入。唯一的优点是我数学比较好。

所以我想从事前端行业。我是名副其实的非专业人士。但通过自己的坚持和坚持，我在一线互联网公司打拼了几年，取得了一些成绩，比如当了前端负责人、架构师等。 ，曾受邀参加一些技术会议，担任分享嘉宾，在技术论坛分享了很多技术资料，在技术社区担任“署名作者”，开源项目已有近万星。接下来分享一下我在前端自学中遇到的一些坑和学习经历。

1.从大学实习过渡到第一份前端工作（新手阶段）

大三学了几个月前端后，顺利进入一家公司实习。当时我正在开发一个官方网站。因为我对当时的生态非常熟悉，而且分配给我的工作也不难，所以我顺利通过了实习期。 ，我觉得前端就是这样。

后来，由于实习和学校的良好经历，笔者顺利进入了一家拥有三万多名员工的所谓“大公司”。加入公司的第一个月，因为公司用的是Vue，而我对这方面还不是很熟悉，所以经历了很多磨难，瞬间碰壁的感觉真是“爽”。当时我们主要做ERP系统。业务比较复杂，需要很强的技术能力和逻辑思维能力，所以笔者不知道如何弥补。跟随大师，从最基本的层面开始写页面。此阶段（即新手阶段）需要掌握的主要技术点如下：

由于实习期间使用了jq和jq插件，所以只能算是一个API调用工。在我的第一份工作经历中，我学到了很多企业级的产品开发规范。后来因为我的业务部门濒临破产。 ，我没有太多工作要做，所以我主动辞职了。作者后来也总结了自己的工作，希望对大家有所帮助：

2.真正的互联网公司（新手成长阶段）

后来去了一家纯粹的互联网公司。我主要从事游戏和小程序的开发，就是2018年非常火的《贪吃蛇》，当时听说有3亿多用户，心里很兴奋。但当时我对小程序还只是粗浅的了解，于是又进入了新一轮的兴奋。在开发游戏中H5页面的过程中，我确实学到了很多关于js和css3实现的动态营销效果。因为游戏应用对交互和适配要求很高，我一方面疯狂补充自己的CSS知识，另一方面思考JS逻辑。

我在做小程序的时候，也很挣扎。当时小程序对es的支持还不是很好，所以代码中同时包含了es6语法和es5语法。我记得之前涉及到的技术点是提款和付款受理功能。语音识别接口、直播API等，具体知识点总结如下：

虽然技术进步很快，但加班现象却很严重。如果现在有人问我：你还记得凌晨1点的武汉是什么样子吗？我就直接说：4点的看起来更漂亮。

我也总结了这段时间积累的很多知识，很多总结现在还在我的草稿箱里。

3、进阶至中高级前端工程师（中高级成长路径）

由于之前对技术的积累和追求，我决定来上海看看。我花了几天时间找到了一家还算不错的上市公司，开始了我的科技之旅。因为公司产品很多，用户数千万，内容平台也有针对B端企业的Saas系统，但是基本都是采用公司的前端技术栈。由于之前对Vue有偏见，所以只好重新学习一遍。不过我们的主管对我印象很好，给了我一周的时间来熟悉它。项目中，后来发现使用模式其实和Vue很相似，而且之前写JS逻辑已经很熟悉了，所以学JSX很顺利，只用了3天就接手了内容平台。

对公司的技术要求还是很高的。由于它必须处理近百万的日常用户，因此它在性能和页面大小方面投入了大量资金。后来又接了神策大数据、阿里巴巴监控等，当时感觉还欠缺一些东西。太多了。

由于之前有过H5开发经验，所以我不仅参与了内容平台的开发，还负责公司混合APP的开发以及H5活动页面的开发。那时我的野心很大，什么都想学。周六周日我也在公司度过了时光，从此慢慢建立了时间管理体系（被自己折磨着）。虽然这期间发生了很多故事，但我仍在成长。我也做了很多总结和知识点：如下：

这些知识点需要一定的时间来消化。作者总结了其中很多，如下：

还有很多，就不一一列举了。有兴趣的可以到《曲探前端》知乎专栏学习。

高级前端工程师（单角色）

后来经历了很多事情（姑且认为是技术天花板吧），我决定跳槽到一家做人工智能的小公司。当时我是A2（每个公司等级不一样），是高级工程师。我在公司呆了3个月。在这里，我从零开始搭建了公司的前端系统，包括组件库、前端工程、工具库、脚手架等。由于我成功开发了公司中端项目的渲染引擎，后来得到了公司的认可。董事并直接将我提升为公司经理。前端，陆续开始参与招聘、面试、团队管理、研发、攻克新技术。此时，我对技术生态有了更丰富、更深入的了解。

今天终于有时间继续更新了。技术人员的生活仍然不容易。我们先从高级前端工程师说起。笔者加入公司后遇到的第一个问题就是技术选型。因为公司没有完整的前端系统和架构，所以我们需要对现有的产品业务和后端架构进行分析，以确定什么样的技术选型更合适。一开始我们打算使用Vue生态来构建，也就是我们比较熟悉的Vue++vue。 - + vuex set，因为我们的核心产品是中后端产品，所以这个方案比较适合一般中后端产品的快速开发。不过由于之前工作的公司技术栈都用过vue框架，所以花了一天时间把hex vue框架复制了一份。技术研究：

结合公司的项目结构来看，它是一个高度复杂的业务，也是一个多系统协作互操作的模式。未来很可能会演变成微前端架构。当时Vue对此还没有很好的解决方案，所以综合考虑后，作者选择了一种更灵活的方案。 （现在想想，我的选择是对的~），下面是作者总结的一个微前端模式架构图：

作者还总结了一篇关于微前端的文章，大家可以参考一下：

xxxx确定了技术选型后，就该开始构建基本的项目架构和规范代码了。目前，有两种选择：

第一直觉是采用第二种方案，因为这样项目的控制能力更加灵活可控。作者还对项目建设做了总结，大家可以学习参考：

由于中台项目的复杂性，我们还需要使用相对成熟的状态管理库来管理公共状态。目前，相对成熟的生态解决方案包括：

在对比了这些库之后，笔者决定尝试一下dva（当时我从来没有使用过，之前的经历一直都是saga）。对于dva来说，更成熟的一体化解决方案umi出现了。经过研究 umi 发现已经满足了公司现有的业务需求，所以作者后续的所有技术方案都使用了 umi。所以最终的解决方案如下：

又周五了，今天继续更新。

上面我总结了前端工程师在不同阶段需要具备的能力、项目技术选型方案以及如何成长为高级工程师。接下来我会继续介绍一些关于项目中如何解决项目问题以及如何晋升到技术的想法。

前端工程师如何解决项目中遇到的问题

作为一名程序员，我们最基本的任务就是解决公司项目中遇到的问题。对于前端工程师来说，任何问题都是可以量化的，并不是所有问题都能很好解决。所以我们在面对难以解决的问题时，有时需要做出权衡和改变。或许我们可以通过换一种形式来解决呢？

例如，该产品允许我们实现类似在线直播的队列动画，如下：

当我们拿到这个动画的时候，往往不知道如何开始或者如何拆解动画效果，因为仔细分析之后，你会发现这个动画分为以下几个部分：

动画分为以下两个过程：

另一个细节是，无论有多少用户进入，他们都是从同一个位置进入。这时，上一个用户的位置就会上移，如下图所示：

但正如作者上面把动画描述的很清楚，其实我们只需要实现每一步，即拆解和组装的过程即可。我们的很多前端问题基本上都会经过这几个步骤。关键是作为工程师我们要学会把问题弄清楚，这是实现目标的第一步。类似的例子还有很多。作者将用如何设计组件来说明如何更高效地解决问题。

如何在前端从头开始设计一个复杂的组件

在项目开发中，我们难免会用到各种组件和组件库，比如ant等，但这些只能满足我们基本的页面构建需求。实际工作中，经常会有各种杂七杂八的业务组件。我们需要自己开发它。在我之前的公司，基础定制组件占了60%。如果你觉得自己设计前端组件有困难，那么请看看我下面的分享。

作者之前自己开发过很多组件库。关于组件库的搭建和设计经验，他之前也分享过很多。您可以参考以下文章：

那么我们如何开始设计一个组件呢？作者在这里举一个例子：从头开始设计一个抽屉组件。

当我们面对这样的组件时，首先要使用上面笔者介绍的方法，现在想想需求，如下：

明确了需求之后，我们只需要按照上面笔者分享的文章中的方法来编写组件即可。这样，我们就可以把一个大任务分解成一个个小任务。解决了所有的小任务之后，我们这就解决了真正的大问题。

那么，有了上面的方法，你还觉得做前端很难吗？

今天终于有时间来更新了。下面继续说一下如何学习前端，这样才不会费劲。

前面说过，可以说已经是前端工程师必备的技能之一了。我们之前使用的前端工程工具gulp，或者前端集成解决方案umi，都是密不可分的。作者在之前的工作中也使用过它来完成前端系统的搭建。

笔者这里就不一一介绍基本的使用方法了。公众号“曲探前端”里有非常详细的教程。作者在这里会讲几个核心的API和关注点：

这些都是开发中必须掌握的知识点。对于框架，作者推荐如下：

这三个框架基本上是一线互联网公司使用最多的，是集成度和扩展性最强的框架。作者还在曲探前端写过很多实用文章，如下：

还有很多，这里就不一一介绍了。

我们来看看实际应用。以我在一线公司的经历，我主要用它们做中间层和轻服务，比如

还有更多您可以尝试。以上均为作者深度负责的项目。如果你有兴趣，可以和我交流。

对于一个大前端来说，掌握它就意味着你拥有了一把利剑，可以让我们平时觉得麻烦复杂的问题通过思路去实现。慢慢你就会发现前端技术其实就是这么简单。

当我们掌握了之后，后面就要考虑性能问题了，因为相对于其他后端语言来说，内存管理和瓶颈还是很有限的，所以一定要做好优化工作。后面我会继续介绍一些优化技巧。

今天我们有时间继续赶上更新。上面我们讲了用前端赋能来打造前端工程师的核心竞争力。由于笔者之前也写过很多实用的开源项目，所以我先回答如何成为一名有影响力的开发者。开源项目。

作为一名程序员，它是我们必备的法宝。在职场中，很多面试官都会看应聘者的横向发展和对技术社区的了解，而开源项目就是加分点之一。我们用好了，前端开发就可以游刃有余了，因为工作中遇到的问题80%基本上都可以在网上得到解答。所以作为前端工程师，我们也要自己搭建。

笔者认为，一个好的开源项目必须经得起时间的考验，与时俱进。比如我们前端常用的vue，这些开源框架和库几乎在技术发展的每个阶段都在不断更新和优化。 ，努力让自己更加“完美”。作者在这里总结了一个好的开源项目必备的要素：

如果满足以上要素，我认为这是一个很好的开源项目。我看过大量国外优秀的开源项目，他们基本上都遵循上述要素。另一方面，国内的一些开源项目要么在面试中回答问题，要么开卡。是的，有时候格局决定了一个技术人未来的发展。所以如果你想让自己变得更好，让前端工作变得更轻松，请牢记上面作者提出的开源元素五项原则。作者也开源了很多开源项目，其中star超过6000+，基本遵循以上原则，大家可以参考：

最近我也在迭代H5——这个低代码项目，主要是用来可视化拖拽生成H5页面，比如页面制作，页面编辑等，有兴趣的话可以研究一下。我也会在《趣谈前端》中同步我们的最新进展。

那么，你是否也想做一个既有趣又能让你成长的开源项目呢？然后用上面提到的方法快速尝试一下。

因为这些项目基本都是相关的，所以后面我会总结一下性能优化的内容，帮助大家轻松开发项目，让前端变得越来越简单。

今天继续跟进。上面我们讲了如何做开源项目以及如何利用它们为前端赋能。接下来我们来说说性能优化。

如何优化我们的绩效？

从笔者的工作经验来看，任何语言的性能优化都需要从以下几个方面入手：

前两点我们很容易处理。其实我们可以删除文件中不用的模块，将全局可复用的代码抽象成一个通用库，并做好模块的命名和划分，因为本质上是语法，所以我们可以从语言层面来优化方法。作者还总结了一篇详细的性能优化文章：

对于脚本执行性能，我们可以参考函数式编程范式。例如，这两个库在计算性能方面从来都不是最好的。因此，如果有大数据处理业务，我们可以选择性能更好的算法，比如查询算法有两类。排序算法采用快速排序、归并排序或希尔排序。作者之前做过不同算法的性能对比和实现方案。如果您有兴趣，可以研究学习：

另一个问题是执行方法。考虑到是单线程，在处理耗时任务时需要排队。如果有大量耗时任务，服务器可能会掉线。幸运的是，目前已经有了多进程的替代方案，所以对于耗时的任务，我们可以使用父子进程通信的方式，让子进程处理，而主进程正常处理其他业务请求。作者在多个项目中都采用了这个解决方案，大家可以参考一下。

它让我们能够更快地操作json并遵循优雅的数据结构。

其次，我们还可以使用()来读取文件并返回给客户端，这对于读写大文件非常有用。

今天继续更新。接下来说一下让前端学习变得更轻松的工程管理。

如何使用前端工程管理

首先，笔者认为前端工程化主要解决以下问题：

以上几点是任何有技术追求的前端团队都会考虑的问题。笔者之前也做了很多实践，正在开发：

该项目也已获得大量应用。这里笔者主要分享一下他在其中扮演的角色。

我们现在的前端工程主要使用gulp、vite等，它们的底层都或多或少涉及到：

例如，团队构建自己的cli工具，与模块打包工具相结合，创建定制化的项目项目、活动配置系统等，这些都可以轻松实现，并且结合脚本，可以在项目中灵活切换技术选型。作者还总结了一篇文章，有兴趣的可以详细了解：

如何开始旅程

前段时间一直忙于工作和开源项目H5-，终于赶上清明节假期继续更新我们的《如何让前端不再费劲》。接下来我们就来讨论一下这几年比较流行的技术。

随着国内外云服务厂商的“服务云”不断完善和升级，这项技术不断浮出水面。

这并不意味着不再需要服务器。突出的是开发人员不再需要过多考虑服务器。计算资源的概念表现为服务而不是服务器。它是构建和管理基于微服务的架构的完整过程，允许您在服务部署级别而不是服务器部署级别管理应用程序部署。您甚至可以管理特定功能或端口的部署，这使得开发人员可以快速迭代并更快地开发软件。

是思维方式的改变，一改以往：“构建一个框架，在服务器上运行，响应多个事件”。到：“构建或使用微服务或微功能来响应事件。”，我们可以使用前端工程师最熟悉的node.js及其上层框架，框架变得不再那么重要。

它为企业解决的最大痛点是应用部署成本和相应的速度。我们通过函数计算来最大限度地降低服务器成本，并且应用服务的部署级别可以缩减为功能单元，从而大大提高了需求响应。速度，如下：

因此，学习将是前端工程师进步不可或缺的一环。由于不同的函数计算提供商内置的使用结构略有不同，这里无法形成统一的学习体验，所以笔者推荐一个学习函数计算的网站。您可以从中学习：

当然，学习成本并不是很高，所以不用太担心，只要努力学习就可以了。

我一直在迭代H5-| H5编辑这段时间，终于有时间继续更新这个问题了。接下来我就来说说如何在职场中快速成长。

如何在职场中快速成长

进入任何一家公司，都意味着需要迎来新的创新。我们需要快速适应公司的环境、节奏、职场氛围。作为一名前端工程师，想要轻松应对职场中的各种问题，就必须积极主动。学习“企业文化”。一方面是科技，另一方面是人文。作为一名追求技术的人，第一步要做的就是掌握公司的技术。我们需要投入大量的精力来快速适应公司的技术和需求。改变，才能让我们在公司有一个稳定的地位。第二步是主动适应公司文化，为公司业务发展做出自己的贡献。这也是职业晋升的第一步。同时，也要处理好与同事的关系，不断学习。下面是一个实用的学习模型。对于每个人：

当你晋升到技术管理职位后，你考虑的不是个人发展，而是团队发展。我们需要带领技术团队走向成功，所以我们需要培养更好的人，比如定期的技术分享（2周一次比较合适）。

好了，今天的分享就到这里。如果您在技术道路上也有一些疑问，欢迎随时与我交流。