TinyNG 是基于 Angular + TypeScript 的前端 UI 组件库，旨在为开发人员带来更高效的开发体验和统一的视觉交互风格。TinyNG 已经在华为内部使用四年，支撑数百个企业产品，拥有强大的稳定性和可靠性。现在，我们将TinyNG开源，让更多的开发人员能够体验它所带来的惊喜和效率提升。如果您正在寻找一款 Angular UI组件库，我们真诚地邀请您来尝试使用TinyNG，并享受它所带来的卓越体验和无限可能。同时，我们也期待您的反馈和建议，让 TinyNG 变得更加完善和易用。我们相信，开源后的 TinyNG 将会得到更多的注重和关注，并且会有更多的人参与其中，为它的发展和壮大做出更大的贡献。欢迎体验TinyNG ！
组件多
TinyNG 包含了丰富的用户界面组件，非常易于集成和使用。目前，TinyNG 已经开源了 70 多个基础组件，并将逐步开源 100 多个组件，涵盖了企业级全场景，可以满足各种不同领域的需求。
每个组件都提供了详细的功能介绍和示例，初学者也可以轻松地理解和使用。此外，我们致力于不断完善和改进组件，以满足开发者日益增长的需求。
主题灵活
TinyNG 可以根据业务需求快速切换主题风格，非常灵活方便；也可以轻松打造独具特色的主题风格，提高开发效率。
内置主题
TinyNG 首创零配置使用默认主题，无需手动写入加载 theme-default.css 的代码，从而简化了使用流程。此外，TinyNG还为用户提供了内置的四套主题，可以根据实际设计需求进行自由切换。这些主题包含丰富的颜色和样式，满足了各种不同场景下的设计要求，使页面设计更加美观大方。theme-blue.css theme-green.css theme-purple.css theme-red.css
自定义主题
业内传统的组件库一般采用 Less/Sass 作为主题，需要编译后才能使用。这不仅增加了开发者的工作量，还侵入了业务项目的编译配置，给项目带来了不必要的麻烦。TinyNG采用了全新的方式，使用 CSS Var 自定义主题，免编译主题，让主题定制更加便捷；同时也支持 JavaScript 在运行时更改变量。CSS Var 主题不仅简单易用，还可以让开发者更加专注于业务逻辑的实现。另外，TinyNG 还支持在 JavaScript 代码中指定一个品牌色，来快速创建一套自定义主题，这样用户不需要自己编写复杂的主题样式，最轻松实现主题的个性化定制。
主题配置平台
TinyNG 拥有一款强大的主题配置平台，可以让主题定制变得更加简单和直观。通过所见即所得的方式，用户可以轻松编译主题色、场景色、组件色（颜色、字体、边框、阴影）等，实现个性化的主题定制，让项目更加美观和独特。除此之外，主题配置平台还提供了一键发布到 npmjs.org 的功能，让用户可以更加方便地分享和使用自己定制的主题。
微组件
TinyNG 的微组件具有单组件独立版本号管理的特点，每个组件都可以单独安装或升级，这使得组件的管理更加灵活和方便。如果您使用了多个组件，只需要升级其中一个，就能够免去全量测试，提高开发效率和稳定性。
性能超高
TinyNG 的组件库涉及到海量数据的组件（如 Select、Tree、Table 等），都已经内置虚拟滚动功能，可以保持丝滑稳定的用户体验。这一特性极大地提升了组件的性能和响应速度，使得高负载的应用程序也能够轻松运行。虚拟滚动是一种优化技术，它只在屏幕上显示当前可见的部分数据，而不是将所有数据一次性加载到页面中。这样可以避免大量的 DOM 操作，减少页面的渲染时间，从而提高了页面的性能和响应速度。
除此之外，TinyNG 的组件库还支持高性能 OnPush 模式，这意味着当组件的输入属性发生变化时，组件只会在需要更新时才重新渲染，从而避免了不必要的 DOM 操作，进一步提高了组件库的性能和响应速度。
企业级安全
企业级安全是我们一直以来的核心关注点，我们致力于保障客户的信息安全，所有接口杜绝XSS攻击，让您百分之百放心。我们的安全技术团队不断更新升级，采用最先进的技术手段，为您的数据保驾护航。
国际化
在国际化方面，TinyNG 不仅提供了五种常用语言，还支持自定义新语言，以满足不同客户的需求。TinyNG 可以适应各种语言环境，让您的用户可以用自己熟悉的语言使用您的产品，提高用户体验和满意度。
开箱即用
TinyNG 采用开箱即用的设计，让您能够立即开始使用。详尽而易于理解的文档示例，让您能够轻松上手，快速掌握产品的使用方式。
TinyNG 提供了 CLI 脚手架工具，只需一键项目初始化，让您可以快速搭建项目。
同步升级
同时，我们与 Angular 保持同步升级，TinyNG 支持所有 Angular 活跃版。
继承
TinyNG 采用面向对象的继承，可以轻松地扩展基础组件的功能，节省代码的编写，使得应用程序更加容易维护和管理。例如：所有组件都继承自TiBaseComponent 获得 id 相关功能，所有表单组件都继承自 TiFormComponent 免去编写 Angular 表单相关函数。
组合
TinyNG 采用组合模式，通过自由组合各种基础组件和自定义组件，来实现所需的复杂组件。每个基础组件都可以根据需要进行配置和自定义，以适应不同场景的需求。例如：Select 组件，就是由不同层次的大小组件组合而成。
面向对象
我们在设计 TinyNG 的时候采用了面向对象的架构，这意味着我们的代码具有更低的重复率，远远超过其他竞争对手（例如谷歌等）一个数量级。我们相信，面向对象编程是编写可复用高质量代码的关键，它可以更加灵活的复用代码，从而提高整个项目的可维护性和可扩展性，更加高效地实现功能和解决问题。
总之，我们为 TinyNG 注入了我们的心血和热情，希望能够为广大开发者提供便捷、高效、可靠的组件解决方案。TinyNG 作为一款易用、高效的开源组件库，已经准备好在各种应用场景中展现其杰出的性能和功能。我们期待更多的开发者、设计师、产品经理以及爱好者加入我们的行列，一起推进这个组件库的发展，共同打磨出更加完善、优秀的产品，为用户创造更好的体验和价值。现在就加入我们，体验 TinyNG 带来的乐趣吧！
其他说明
目前OpenTiny项目已经开源啦！OpenTiny 是一套华为云出品的企业级组件库解决方案，适配 PC 端 / 移动端等多端，涵盖 Vue2 / Vue3 / Angular 多技术栈，拥有主题配置系统 / 中后台模板 / CLI 命令行等效率提升工具，可帮助开发者高效开发 Web 应用。如果你对跨端、跨框架的OpenTiny项目 感兴趣，欢迎参与到OpenTiny的开源社区中来，一起将它建设得更好！
对于OpenTiny开源项目，欢迎直接添加下小助手微信：opentiny-official，有需要也可以一起交流前端技术，一起玩开源。
OpenTiny 官网：https://opentiny.design/
OpenTiny 代码仓库：https://github.com/opentiny/
Vue 组件库：https://github.com/opentiny/tiny-vue（欢迎 Star）
Angluar组件库：https://github.com/opentiny/ng（欢迎 Star）
CLI工具：https://github.com/opentiny/tiny-cli（欢迎 Star）
541
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
