IT极限技术分享汇腾讯TNTWeb团队是一支拥有较丰富经验和技术实力的前端团队，在Web前端、NodeJS开发、UI设计以及移动APP等大前端领域都有较多的实践经验和技术沉淀。团队始保持着谦逊和低调的态度，并终积极投身于前端基础设施的建设与完善。通过持续的技术创新和流程优化，不断提升业务开发的效率，为产品创新提供坚实的技术支撑。
下面整理了一些TNTWeb前端团队主导开发的开源项目，这些项目广泛涉及低代码、音视频处理、H5开发以及微前端等多个技术领域。我们深知，在这些项目中仍存在诸多待完善之处。因此我们希望能以此为契机，抛砖引玉，吸引广大开发者与我们携手共建，共同推动前端技术的不断进步与创新。
1. TNT-Weekly
github: https://github.com/tnfe/TNT-Weekly
相关文章: https://juejin.cn/post/7020678748307456007
前端行业正以惊人的速度发展，新技术如潮水般源源不断地涌现，相关的信息和文章也如繁星般遍布在各个领域。在这信息爆炸的时代，我们往往感到迷茫，难以辨别哪些信息对自己真正具有价值。鉴于此，TNTWeb 团队精心策划并启动了这个周刊项目，旨在为广大前端开发人员汇集小程序以及其他 web 前端技术领域的优质内容，提供一个知识的宝库，帮助他们在信息的海洋中迅速找到有价值的信息，紧跟行业发展的步伐。
2. FFCreator
github: https://github.com/tnfe/FFCreator
相关文章: https://juejin.cn/post/7046653290422992927、https://juejin.cn…
FFCreator是一个基于node.js的轻量、灵活的视频制作工具库。它让每个人都能轻松制作视频。只需几张图片或视频片段，加上一段背景音乐，即可迅速生成炫酷的视频短片。在短视频日益流行的今天，FFCreator为解决用户快速生产短视频或平台批量合成视频提供了简单高效的解决方案。它依赖少、配置低，轻松上手，让视频制作变得简单又快捷。
3. Hel
github: https://github.com/Tencent/hel
相关文章: https://juejin.cn/post/7176646667729371196、https://juejin.cn…
Hel是腾讯TNTWeb团队开源的轻量微前端框架，它是一种用于构建现代 Web 应用程序的架构，它提供了一种在运行时动态加载和集成远程模块的方法。这些模块可以部署在 CDN 上，当远程模块发布更新后，无需重新构建和发布整个应用程序，即可立即生效。这种方式提高了应用程序的开发效率和灵活性，使得开发人员能够更加高效地构建和维护复杂的 Web 应用程序。
4. tdesign-react-starter
github: https://github.com/Tencent/tdesign-react-starter
相关文章: https://juejin.cn/post/7078854497396588580
TDesign React Starter 是以 TDesign React 组件库为基础构建的中后台模板，它包含了丰富且全面的组件示例。通过借鉴社区的最佳实践，并结合我们的业务模式，我们精心提炼出了一套即开即用的解决方案，旨在帮助 React 技术栈的开发者提高研发效率。
该产品具有以下特性：
- 提供便捷的开发体验，无需额外配置即可上手。
- 全面支持 TypeScript，提升开发的类型安全性和效率。
- 拥有简洁明了的项目结构，方便管理和维护。
- 具备美观的样式，支持多种主题切换，满足个性化需求。
- 具备完善的系统架构和开发工具链，提升开发效率和质量。
5. vue3-infinite-list
github: https://github.com/tnfe/vue3-infinite-list
相关文章: https://juejin.cn/post/7079632420177362974、https://juejin.cn…
一个专为Vue设计的短小精悍的无限滚动加载库，不仅体积小巧——gzip压缩后仅占3kb——而且完全零依赖，展现出强大的独立性💪。无论是渲染百万级别的列表，还是轻松应对各种滚动需求，它都能游刃有余地完成。你可以使用它滚动到指定的条目，或者设定初始的滚动偏移量。同时，它还支持固定或可变的宽度与高度，以及垂直或水平方向的列表展示，为你的项目提供极大的灵活性和便利性。https://juejin.cn/post/7079632420177362974
6. wp2vite
github: https://github.com/tnfe/wp2vite
相关文章: https://juejin.cn/post/6953145736095596558、https://juejin.cn…
一款前端项目自动转换工具，旨在让您的Webpack项目轻松升级为支持Vite的项目。wp2vite不仅保留了您原有的Webpack配置，还会向项目中注入Vite所需的配置信息。通过使用wp2vite，您将体验到比Webpack快大约80%的开发速度，以及比Webpack快约50%的构建速度，从而大幅提升您的工作效率。
7. awesome-state
集合汇聚了当前市场上主流的 React 状态管理解决方案，为开发者提供了丰富的选择。无论是Redux的经典范式，MobX的响应式编程，还是Zustand的轻量级和直观性，以及Recoil等新兴库的创新特性，这里应有尽有。为开发者呈现了一个全面而多样化的状态管理生态。通过这个集合，开发者可以轻松了解并比较不同库的优势和特点，从而选择最适合自己项目的状态管理方案。
8. clean-state
github: https://github.com/tnfe/clean-state
相关文章: https://juejin.cn/post/7005500716278087693
🐻 Clean-State是一款整洁且紧凑的React状态管理工具。它摒弃了React的历史包袱，利用原生钩子实现，并解决了Redux在状态更新时出现的无效渲染问题。在架构层面，它通过非常简单的API实现了自动组织。🍋 如果您不是在建造一艘航空母舰，而是厌倦了庞大、复杂且难以使用的状态管理库，那么请尝试使用Clean-State。它小巧精致，极致的性能定能满足您的需求。
9. csijs
github: https://github.com/tnfe/csijs
相关文章: https://juejin.cn/post/7037700281420742693
CSI.JS是一个前端日志系统，它将错误信息记录于本地localStorage中。无任何依赖、无入侵性。使用非常简单，很容易引入你的系统中，而且不会造成任何影响。 它可以帮你快速重建犯罪现场。
10. manage-table
github: https://github.com/tnfe/manage-table
相关文章: https://juejin.cn/post/7067041231376744461
在日常业务场景中，antd的table组件被广泛使用。起初，它可能只展示几行字段，但随着时间推移，需要展示的字段数量不断增加，并且不同用户希望看到的字段也各有差异。为了解决这个问题，我们封装了名为manage-table的组件。该组件内部依然基于antd构建，但增加了对显示列的灵活操作处理逻辑。
manage-table组件内置了一个功能，即将用户设置的展示列存储在localStorage中。为了保证存储的唯一性，我们使用了参数name作为唯一标识进行存储。因此，在使用manage-table时，请确保在单一域名内，所需展示列的设置保持唯一性，以避免数据冲突或覆盖。这样，不同用户可以根据自己的需求，灵活地定制和保存表格的展示列设置。
11. FEDiagram
github: https://github.com/tnfe/FEDiagram
相关文章: https://juejin.cn/post/7087826037433712671
前端技术领域涵盖的知识点极为丰富，其中不乏抽象且难以理解的内容。这些知识点仅凭文字往往难以直观表达，导致许多开发者对其理解模糊不清。为了解决这个问题，Diagram项目致力于通过图形化的方式，将前端技术中的复杂知识点以直观、易懂的形式展现出来，帮助开发者深入理解和掌握前端技术的核心要素。我们相信，通过Diagram的图形化展示，开发者们将能够更加轻松地领悟前端技术的精髓，并在实践中游刃有余地应用这些知识点。
12. bbo
github: https://github.com/tnfe/bbo
每位前端开发者都拥有自己的实用工具库，而我们常常会编写那些易被遗忘却又高频使用的方法。bbo 就是这样一个超小且实用的 JavaScript 工具库，它并不与 lodash、underscore 或 lazy.js 等库相冲突。
我整理出了日常开发中使用频率最高的函数。这些函数在你的开发中几乎无处不在，但在 lodash 和 underscore 中却难觅其踪。
bbo 代码简洁，gzip 压缩后不足 7k，可随时随地无忧使用。
13. limu
github: https://github.com/tnfe/limu
相关文章: https://juejin.cn/post/7320437823332450304
limu，即love immutable的缩写，是专为高效创建和操作不可变对象而设计的。它基于读取时的浅拷贝和写入时的标记修改机制，实现了出色的性能。
在各种场景中，limu的速度通常是immer的2倍或20倍以上，展现出惊人的性能。你可以通过点击在线性能演示来亲自体验这一结果。
值得一提的是，limu在默认情况下不会冻结状态，这使得它在大多数场景中比immer更快10倍或更多。这一特性使得开发过程更加流畅，提高了开发效率。
此外，limu还非常友好于调试。你可以在任何时候直接查看草稿，而无需担心当前状态的影响。这使得调试过程更加简单和直观。
14. TransX
github: https://github.com/tnfe/transx
一个精致小巧的 Vue 组件切换动画库，提供了超过十种炫酷的动画切换方式，不仅效果惊艳，而且非常轻量级，为您的项目增添一抹生动的活力！无论是新手还是资深开发者都能轻松上手。它不仅能够为您的 Vue 项目提供流畅且富有创意的动画效果，还能在保持性能的同时，提升用户体验和界面的吸引力。
15. tntweb-admin
tntweb-admin是一个由腾讯TNTWeb前端团队开发的开源React手脚架项目。该项目基于concent、react、react-router、Ant Design、typescript、jest等多项技术构建，不仅功能强大，而且具有独特的双引擎驱动特性。开发者可以自由选择使用webpack或vite作为构建工具进行开发与调试，这为喜欢vite快速调试体验的朋友提供了极大的便利。
16. awesome-blackmagic
在web开发的过程中，我们时常会遇到一些非常规、颇具挑战性的需求。为了满足这些需求，我们有时需要深入挖掘并巧妙运用我们所掌握技术的那些鲜为人知的功能和特性。这些独特而精妙的技术手段，我们称之为“黑魔法”。而awesome-blackmagic项目，正是致力于定期为web开发人员分享这些充满创意与智慧的技术应用，帮助他们拓宽视野，激发灵感，更好地应对各种复杂的开发挑战。
感谢您的耐心阅读！
