图片来源:pexels.com

“别更新了,学不动了”向来是前端开发群体的切肤之痛:

  • React 还没学明白,Vue 就出来了;

  • Vue 2.0 还没上手,3.0 就发布了;

  • Node 刚精通,Deno 又 1.0 了;

  • Flutter 刚流行,Flutter 又被唱衰了;

  • 就更别提原生、跨端、混合开发的循环往复了。

所以前端圈曾经有一位技术专家下过深切的论断——前端 18 个月难度翻番。此言道出了前端领域更新换代之快背后的前端开发血泪史。也因此,“别更新了,学不动了”这句话成为了不少前端开发玩梗的口头禅。

但从国内前端专家月影的角度看,如果你不盲目地去追求所谓的“时髦”技术,不去刻意担心自己是否落伍,而是去多观察这个行业,找到技术发展内在的规律和脉络,那么你就知道该如何前进,不会有任何恐慌。

在任何一个领域或方向,知识体系都可以大体上分为基础知识和领域知识,而领域知识又可以分为通用领域知识和专用领域知识。二者的变化是不一样的,基础知识的变化最慢,其次是通用领域知识,然后是专用领域知识。深入学习基础知识,按需学习领域知识,这就是把握技术本质的基本逻辑。

2021 年 10月 27-28 日,由稀土掘金社区举办的首届稀土开发者大会,将体系化地呈现当前国内大前端领域的技术发展,带给参会者对大前端技术发展的本质脉络。目前大会设置了「大前端工程与架构」、「大前端性能优化」、「大前端技术探索」三个专题,邀请了国内一线大厂前端技术专家分享精彩实践经验。

大前端工程与架构

专题简介:

前端工程与架构随着互联网的发展,企业业务的不断深入与变化,前后端不断拆分与重组;前端架构形态也不断调整,之前火热的前端中台、微前端也不断更替;现在前端架构在企业发展现状如何,我们来一起探索。

出品人:张飞彪 字节跳动 创意生态技术负责人

现就职于字节跳动上海研发中心,担任创意生态技术负责人,之前曾负责抖音电商上海研发团队、抖音音乐项目、小红书客户端。毕业于华东师范大学数学系国家理科基地班,自学完计算机专业的所有主干课程,从事移动软件开发工作十年以上,先后参与过 Windows Mobile、Windows Phone、嵌入式、 Android 以及 iOS 等平台的 App 和框架开发,主导了多款大中型 App 的研发,也曾作为客户端架构师负责过 Android、iOS、Web 三端的基础架构设计和演进,在移动架构、跨平台开发等大前端领域具有丰富的研发和管理经验。

议题介绍:

议题一:《支付宝钱包动态化技术方案的现状和演进》——王佐 蚂蚁集团 支付宝事业群小程序技术部高级技术专家

支付宝在 17 年左右启动了钱包下一代动态化技术方案 Cube。在过去的 4 年中,通过业务的打磨,逐渐形成了两个技术产品。一个是面向移动端应用开发的动态卡片技术栈,在原生的 Native 页面中嵌入动态卡片;开发者使用类 Vue 的语法编写动态卡片的布局和逻辑,发布即可见,从而提高原生页面的运营效率。一个是面向 IoT 应用开发的小程序技术栈,向低端设备上的开发者提供提供小程序技术,目前主要应用于电视/收银台等场景。

议题二:《美团企业应用前端工程化实践》——杨林 美团 基础研发前端技术专家

在美团,支撑业务高效运转的企业应用是较为复杂的 ToB 业务,包括 HR、财务和 ERP 等业务,这些领域下有 100+ 系统,几千个页面,特点是系统多,交互复杂,业务迭代快,本次分享介绍我们建设大型的 ToB 应用的过程,如何通过“微前端架构+开发模板化”的工程化方式,支持众多业务线并行需求迭代,协同几百人团队快速交付。

议题三:《简洁的艺术 —— astro 带来的全新体验》——薛英琛 字节跳动 小程序前端开发工程师

现代前端开发技术的演进史几乎就是 JavaScript 的发展史,我们越来越少去直接编写 HTML/CSS,转而将这项工作交给各类 JavaScript 框架与工具,但是这并不是无痛的抽象,很明显我们正在为无限的自由买单。Astro 是解决这个问题的一种选择。它利用 partial-hydrate 的手段,结合用户交互特点,尽量地按需加载,同时在编译时自动识别内容去做静态化。另外,它也天然支持微前端,结合一整套 bundleless 开发链路,大幅提升开发者构建复杂的前端应用的开发体验。

议题四:《贝壳视觉物料生产平台的架构与实践》——闫士博 贝壳找房 资深前端工程师

随着业务发展,公司的视频、图片等各类物料的需求日益增长,开发与设计的人力捉襟见肘。贝壳视觉物料生产平台,是前端技术创新与架构赋能业务的典型,通过自动识别各类设计稿,加之图文、视频、动态 GIF 的可视化编辑与数据配置,统一视觉物料的生产管理能力,支持各业务低成本完成物料相关需求,并赋予上千运营人员直接制作视觉物料的能力,大大提高产研效率,为公司的业务运营保驾护航。

大前端性能优化

专题简介:

在移动互联网时代,由于设备资源、网络等因素,性能优化显得尤为重要,反之,性能不友好的产品,用户流失率极高。本专场将邀请在 Web 前端、渲染引擎和特定场景下有速度优化经验的技术专家,通过对性能优化优化工具及技术,去分享其在端上的实践经验。

出品人:梁士兴 美团买菜终端研发负责人

2009 年毕业于北京航空航天大学,2014 年 7 月份加入到美团,现任美团买菜终端研发组负责人。

多年从事大前端方向的技术研发工作,对应用架构演变、大前端工程化建设以及大前端的技术发展趋势有浓厚的兴趣,希望能够与大家进行交流和分享。

议题介绍:

议题一:《手淘跨平台引擎架构与未来演进》——彭涛(龙冥) 阿里巴巴 无线技术专家

互联网业务如火如荼的飞速发展,新的跨平台技术也随着历史的浪潮在探索和实践中不断涌现,最成熟的跨平台技术莫过于大家熟知的浏览器技术。标准化以及其强大的生态,加上硬件的不断升级所带来的性能红利使它一直占据着举足轻重的重要地位,随着业务复杂度的不断提升,从后来的 Weex/React Native,到现在如火如荼的 Flutter,也标志着新一代跨平台架构已升级为自绘渲染,高性能脚本引擎等内核技术深水区。如何满足差异化业务场景,依托前端成熟的生态与标准化,减少业务的迁移适配成本,通过一套跨端内核引擎支持多 App,以至多生态乃至不同的前端框架,成为了跨平台架构的新挑战。本次将分享从手淘几年来随着业务发展所带来架构升级思考,核心性能瓶颈的突破以及对未来几年内跨平台架构的探索方向,希望能与您产生技术上的共鸣与互勉。

议题二:《预加载技术在百度 App 上的应用》——杨刚 百度 百度 App T7 浏览内核研发工程师、整体内核技术负责人

随着移动设备性能的整体提升(CPU、内存、网络等),越来越多的移动应用通过预取技术来优化 H5 相关业务的首屏性能,百度 App 也在很多业务场景使用了这一技术。预取技术很诱人,对打开速度往往可以起到立竿见影的效果,但在移动端相比 PC 还是有很多需要注意的事项,比如,由于 32 位运行模式的关系,内存仍然是一个需要高度关注的一个点。本次主题将通过对移动端 H5 业务速度拆解、常用优化手段特别是预取技术的原理及优缺点入手,梳理预取技术的注意事项,以及预取技术在百度app的应用实践过程。

议题三:《前端页面加载性能优化实践及运维》——王梓童 美团 买菜事业部 iOS 开发工程师

随着业务不断地发展,美团开始引入 RN 用于解决对开发效率和更新速度的需求,同时使用 H5 支撑数量繁多的营销活动。RN、H5 在性能上相较 Native 技术有着天然的劣势。如何在享受开发迭代效率提升的同时,满足用户日益严苛的性能体验要求,成为每个移动开发者追求的目标。为此,作为美团的新业务团队,在2021年上半年度对性能进行了专项优化;在半年时间里,将 RN 页面 1s 内渲染出首屏的比例由40%提升至了85%,实现了页面秒开甚至近乎直出的性能体验,H5 TP90 首屏时间由也从 4500ms 降低到了 2000ms。本次分享将深入 RN、H5 的技术原理,分析优化思路,系统性介绍在美团有着丰富实践的成熟优化措施,以及相关指标是如何监控运维的。相信经过本次分享交流,你可以更全面地了解前端性能的优化方案,并结合自己 App 的实际情况落地。

议题四:《小红书搭建秒开 H5 的关键技术设计》——杨远翔 小红书 电商技术部电商大前端负责人

首屏性能一直在快迭代 H5 业务中被人诟病,尤其是在无法定制首屏优化,有丰富内容的运营搭建场景。我们吸取了近几年业界公开关于性能探索中宝贵实践经验,在搭建业务中逐步探索、沉淀出一套基于"真实用户体感秒开"的技术方案。全员参与(前后端、QA、产品视觉),管"挖"管"埋"。

大前端技术探索

专题简介:

随着互联网不断发展,前端技术也跟上班车;Vue 发布 3.0 新特性,React 版本也到了 V17;连 Flutter 也开始和 XD 紧密联系。本专题将聚焦 2021 新技术及未来前端领域的新技术发展趋势。

出品人:李玉北 字节跳动 Web Infra 团队负责人

开源爱好者,热爱 JavaScript 社区,目前负责字节跳动 Web Infra 团队 (https://webinfra.org/sg)。团队的职责是维护公司前端的技术设施和服务(例如:Node.js、Serverless、跨端解决方案等等),并同时打造下一代的 Web 开发引擎,重塑基于 Web 技术栈的应用的开发流程。

议题介绍:

议题一:《开发、维护与微循环》——张立理 百度EE 前端架构师

在一个相对长期维护与发展的应用中,开发者需要更多时间面对功能的增量迭代、已有功能的调整、修复与优化等情况。

传统的初始脚手架、构建工具、代码生成等虽有助于项目从零到一的快速启动,但在增量迭代中难以发挥持续地效益。

项目的长期持续开发是一个个人能力、开发模式、团队协作紧密结合的过程,本次分享将介绍一种基于组件化的开发形式,力求通过统一的手段进行工作的分解,在细粒度上完成定义、开发、验证、冻结的研发循环,进而保持合适的开发节奏、效率、质量。

议题二:《从历史的演进来看前端业务工程的发展》——俞天翔 快手 Web开发探索组前端负责人

从“上古时期”的模板拼装到“MV*”的大量被使用;从 jQuery 一统天下到 Vue/React 逐步成为全民框架;从 PC 时代到移动时代,从 2B 到 2C,前端 er 们似乎一直都在探索路上不断前进。在历史的发展进程中,我们是否能够积累出属于我们的工程方案,以应对业务的持续发展。本次分享将结合讲者在过去工作中的经验以及大型活动的“惨痛”开发经历,针对如何对工程进行设计,将工程中变与不变的部分进行拆解,将业务开发逐步演变成“填空题”,保证持续交付和有效积累。

议题三:MWA(现代 Web 应用)框架和 Modern JS 工程方案——宋振伟 字节跳动 Web Infra研发工程师

前端开发和 Web 开发中出现的范式转移都已经累积到接近革命的程度,字节跳动 Web Infra 前段时间介绍了「现代 Web 开发」范式和 、Modern Web Stack、MWA 这些新一代技术,这次会进一步基于 Modern.js 开源项目来介绍 MWA 框架、现代 Web 工程方案。

此外,混沌工程、云原生、分布式数据库、低代码、机器学习、音视频技术等专场议题讲师已全部上线,目前大会线上直播免费预约火热进行中,点击底部 阅读原文 直达大会官网,了解更多专题详情。

点击阅读原文了解更多详情

前端18个月难度翻番?来这里把握大前端技术本质进展丨稀土开发者大会相关推荐

  1. vue前端服务器端口_解密智联招聘的大前端架构 Ada

    作者 | 智联大前端 Ada 是智联招聘自主研发的演进式大前端架构.于 2017 年正式投入使用后,又经过三年持续演进,全面覆盖了从研发到运维的各个方面,具备跨技术栈工程化体系.交互式图形界面开发工具 ...

  2. Android 12 Beta正式亮相;5 月 19 日凌晨 1 点 阔别 2 年的 Google I/O 开发者大会内容集锦

    去年,因为一场席卷全球.突如其来的特殊情况,出于安全考虑,谷歌首次取消了一年一度的 Google I/O 开发者大会,令许多对此翘首以待的开发者感到遗憾. 所幸,今年 Google I/O 开发者大会 ...

  3. 前端趋势榜:上周最 yyds 的 10 大前端项目 - 211101

    大家好,我是你们的 猫哥,那个不喜欢吃鱼.又不喜欢喵 的超级猫又在线营业啦 ~ 平时如何发现好的开源项目,可以看看这篇文章:GitHub 上能挖矿的神仙技巧 - 如何发现优秀开源项目 1. sucra ...

  4. 前端趋势榜:上周最热门的 10 大前端项目 - 210327

    大家好,我是你们的 猫哥,那个不喜欢吃鱼.又不喜欢喵 的超级猫 ~ 关于猫哥,大家可以看看我的年终总结 前端工程师的 2020 年终总结 - 乾坤未定,你我皆黑马. 猫哥从 2016 年加入 GitH ...

  5. 聊聊这次试用期“被”离职和感悟(大前端组)

    点击上方"IT平头哥联盟",选择"置顶或者星标" 你的关注意义重大! 公众号回复"加群"与十万前端一起成长 作者:得闲读书 http://w ...

  6. 谈谈这次试用期“被”离职和感悟(大前端组)

    在新公司的试用期是9月25号到期,前天中午饭时,部门领导找我谈话,说明了我要离开公司. 缘由 关于这次的试用期未过,我先做一下相对客观的陈述. 自我入职新公司,率属于部门领导管理,技术被大前端组约束, ...

  7. 火了几年的大前端,现在怎么样了?

    大概从2017年开始,大前端这个名词开始出现,infoQ的一些技术大会也开始设置大前端议题,react native火的一塌糊涂,阿里.京东.去哪儿也开始推出自己的跨平台实践.时至今日,大前端已经发展 ...

  8. 市面上的大前端岗位到底是做什么的?

    市面上的大前端岗位到底是做什么的? 大前端这个词出现了不是一天两天了,但是这个岗位到底是做什么的,到目前也是仁者见仁智者见智,今天小编就带大家解开这个岗位的神秘面纱. 其实对于所谓的[大前端]技术,市 ...

  9. 跨平台大行其道 CocoaChina 2012年9月开发者大会落幕

    跨平台大行其道 CocoaChina开发者大会落幕 来源:天极网 责编:贺锦虹 http://www.ccw.com.cn 2012-09-03 13:18:57 9月1日,为期一天的移动互联网技术盛 ...

最新文章

  1. Dynamics CRM 导入用户数据错误 could not retrieve salesperson role
  2. javafx中的tree_JavaFX中的塔防(3)
  3. dataset中的数据批量导入oracle数据库,C#如何把某个文件夹下的所有Excel文件导入Oracle数据库。详细点!...
  4. numpy实用技巧(一)
  5. 三、JVM — 类加载过程
  6. 谷歌浏览器 官网下载离线安装包
  7. ShowAPI识别验证码
  8. HTML表格(HTML 表格的使用,收藏这一篇就够了)
  9. c# winform h.265解码
  10. 高德地图 根据经纬度获取地理位置信息
  11. 2021年茶艺师(中级)复审考试及茶艺师(中级)模拟考试题
  12. 轻量易用的网站bug与性能监控平台——灵雀应用监控平台
  13. matlab彩色图像处理实验报告,matlab简单图像处理实验报告
  14. 漫画:国内都有哪些程序员大牛?
  15. 关于《机器学习决策树导出图片、PDF支持中文》解决办法
  16. js实现纯前端截屏(可以对iframe的内容进行截取)
  17. 微信域名防封防屏蔽 微信APP下载链接如何做防封防屏蔽
  18. python之有关魔方方法的内容
  19. Pivoting跳板攻击
  20. ssmtp使用阿里企业邮箱发送邮件

热门文章

  1. mysql使用占位费付_美国大学硕士占位费怎么支付?三种支付方式任选!
  2. 操作socket报Too many open files errno :24错误解决方法
  3. 计组之总线:2、总线仲裁(链式查询、计数器查询、独立请求、分布式查询)
  4. 数据结构之串:基本概念
  5. C++ 后台程序实时性能监控
  6. 钓鱼基础设施的应用分析(钓鱼邮件利用、Gophish)
  7. Twisted中的putChild和getChild
  8. linux查看服务端口号、查看端口(netstat、lsof)
  9. 经典编程问题之:选择排序、冒泡排序、汉诺塔游戏,均用js代码实现
  10. 第十一周总结--助教