您现在的位置: 首页 > 网站导航收录 > 百科知识百科知识
平面设计+前端，工作前景如何？
开发者,自己的,组件平面设计+前端，工作前景如何？
发布时间：2020-12-06加入收藏来源：互联网点击：
3.5、封装样式和Shadow Dom
组件的一个重要方面是封装-能够使标记结构，样式和行为保持隐藏状态，并与页面上的其他代码分开，以使不同部分不会冲突，并且代码可以保持整洁。Shadow DOM API是其中的关键部分，它提供了一种将隐藏的单独DOM附加到元素的方法。Shadow DOM实际上已经被浏览器使用了很长时间了。您可以将影子DOM视为“ DOM中的DOM”。它是自己的隔离DOM树，具有自己的元素和样式，与原始DOM完全隔离。
它允许将隐藏的DOM树附加到常规DOM树中的元素上。该阴影DOM树以影子根开头，可以与普通DOM相同的方式附加到所需的任何元素上。这样做的主要目的是，我们不需要为类使用名称空间，因为不存在名称冲突或样式溢出的风险。这就是Web组件样式进行真正封装的解决方案。
3.6、TypeScript接管前端
最近的每次交谈都听起来好像TS正在接管前端开发。据报道，有80％的开发人员承认他们想在下一个项目中使用或学习TypeScript。尽管有缺点，但TS代码更易于理解，实现更快，产生的错误更少。想重构你的React应用程序并与TS一起使用吗？去吧。想逐步开始吗？使用Bit之类的工具逐步将你的应用程序中的组件重构为TS，并使用React-Typescript编译器独立于应用程序构建它们。
TypeScript，它是有类型定义的 JavaScript 的超集，包括 ES5、ES5+ 和其他一些诸如反射、泛型、类型定义、命名空间等特征的集合，为了大规模 JavaScript 应用开发而生。复杂软件需要用复杂的设计，面向对象就是一种很好的设计方式，使用 TypeScript 的一大好处就是 TypeScript 提供了业界认可的类（ ES5+ 也支持）、泛型、封装、接口面向对象设计能力，以提升 JavaScript 的面向对象设计能力。市面上的框架也对 TypeScript 提供了非常好的支持。
React 对.tsx 支持非常好，比如我在 Midway controller 里支持 tsx 写法，这是非常大胆的，对于后面 react ssr 来说是一个极大便利；Vue 从 v2.5.0 之后对 ts 支持就非常好；Node.js Web 框架，尤其是 Egg.js 对 ts 支持非常好，当然还有更高级更专注的的 Midway 框架，Midway 基于 Egg 生态，同时提供 IoC 等高级玩法；
在使用 Webpack 编译前端应用式，通过 TypeScript-loader 可以很轻松地将 TypeScript 引入到 Webpack 中。有了 TypeScript-loader，就可以一边使用 TypeScript 编写新代码，一边零碎地更新老代码。毕竟 ts 是 js 超集，你有空就改，非强制，特别包容。
3.7、从组件库到动态集合
组件开发的出现催生出了一种工具的产生，它就是Bit，以及其托管平台Bit.dev。使用Bit来连续隔离现有组件并将其导出到动态可重用的共享集合中，而无需努力构建麻烦且高度耦合的组件库。使用Bit，你可以独立隔离，版本控制，构建，测试和更新UI组件。它简化了在现有应用程序中隔离组件，将其收集到远程集合并在任何地方使用的过程。
每个组件都可以在任何项目之外构建，测试和渲染。你可以更新单个组件（及其相关组件），而不是整个应用程序。在bit.dev平台中（或在你自己的服务器上），可以为不同的团队远程托管和组织组件，以便每个团队都可以控制自己的组件开发。每个团队都可以共享和重用组件，但又保持其独立性和控制力。
该平台还提供了共享组件的多合一生态系统：它自动记录UI组件的文档，在交互式中渲染组件，甚至提供内置注册表以使用npm安装组件。此外，你可以在任何存储库中导入组件并进行修改。在短期内，这以与Spotify/iTunes更改以前通过静态CD音乐专辑共享音乐的过程类似的方式，彻底改变了共享和组成组件的过程。这是一个动态的模块化解决方案，每个人都可以共享和使用组件。
从长远来看，Bit有助于微前端的开发。主要是因为它已经可以让你独立版本，测试，构建和更新UI应用程序的各个部分。
3.8、设计与开发的整合
随着组件驱动设计系统的兴起，使产品和团队之间的UI一致，新工具应运而生，弥合了设计师和开发人员之间的鸿沟。但是，这不是简单的任务。尽管代码本身实际上是唯一的真理源（这是用户真正得到的），但是大多数工具都试图弥合设计者与设计者之间的鸿沟。在此类别中，您可以找到成帧器，Figma，Invision DSM等。在开发人员的末端，你可以看到Bit.dev之类的平台如何托管下一代组件库并帮助建立共享组件的采用范围。
该平台为您的实际源代码提供了呈现的可视化效果，以便设计人员可以与开发人员合作，并以可视化方式在源代码本身上进行讨论。要注意的另一个有前途的想法是设计令牌。将令牌放置在代码中，设计人员可以通过它们直接与外部协作工具真正控制简单的样式方面（例如颜色）。与Bit.dev等平台集成后，可以创建比以往更紧密的工作流程。
3.9、跨端开发框架迅猛发展
从最初的React Native，到后来的Flutter，electron，跨端的解决方案受到了大量前端工程师的关注和学习。
Flutter2的发布，其Web开发能力也过度到了稳定版本，同时桌面端开发能力也进入了beta阶段，进一步提高了代码的复用性，同时它也拓展了很多IOS的功能，生态进一步壮大。近乎一套代码便可以完成移动端、web端、桌面端应用的开发，大大缩减开发人员学习其他平台开发技术的成本，一线互联网公司也在将其部分应用使用Flutter进行重构。
electron作为一个基于Nodejsde桌面端跨端开发框架，深受大厂的喜爱，飞书、vscode、twitch等均是基于electron进行开发。跨平台也让 Electron 可同时开发 Web 应用和桌面应用，无论是 UI，还是代码，很多资源都可以共享，大幅减少了开发者的工作量。
需求推动着跨端框架的发展，无论从成本还是效率考虑，跨端开发都将成为前端开发未来的发展方向之一，其生态也会迎来疯狂扩张。
3.10、低代码平台持续发展
随着十四五规划的推出，进一步推动了企业数字化转型的步伐，众多企业面临数字化转型。相较于培养一支开发团队，多数企业更倾向于使用低代码平台，通过无编码或低编码的方式快速搭建自己的数字化系统。同时，低代码平台迎来了爆发式的增长，至今仍将保持50%的平稳增速。平台快速发展，覆盖的业务场景也逐渐增多，中小企业95%以上的场景可通过低代码平台搭建，中大型企业的覆盖率也能达到70%。
低代码平台的迅猛发展，很多业务场景的开发工作逐渐被平台替代，很多简单的前端页面的开发都会转移到平台中完成，初级前端工程师的生存重建逐渐被蚕食。同时低代码平台的发展也会对前端工程师提出了更高的要求。
4、总结
前端开发趋势一直都是热度高且变化快。因此，对于前端开发者来说，想要跟上这些不断变化的趋势，需要耗费巨大的精力。至于2022年前端技术具体会发生哪些变化，让我们拭目以待吧。
本文分享自华为云社区《2022前端技术领域会有哪些新的变化》，作者：架构师李肯。
下一篇：返回列表
相关链接 |
||
| 网友回复（共有 0 条回复） |