[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-10040":3},{"id":4,"name":5,"fullName":6,"owner":5,"repo":5,"description":7,"homepage":8,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":15,"stars7d":16,"stars30d":16,"stars90d":15,"forks30d":15,"starsTrendScore":15,"compositeScore":17,"rankGlobal":9,"rankLanguage":9,"license":9,"archived":18,"fork":18,"defaultBranch":19,"hasWiki":18,"hasPages":20,"topics":21,"createdAt":9,"pushedAt":9,"updatedAt":37,"readmeContent":38,"aiSummary":39,"trendingCount":15,"starSnapshotCount":15,"syncStatus":16,"lastSyncTime":40,"discoverSource":41},10040,"OnsenUI","OnsenUI\u002FOnsenUI","Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.","https:\u002F\u002Fonsen.io\u002F",null,"JavaScript",8867,1002,286,1,0,2,40,false,"master",true,[22,23,24,25,26,27,28,29,30,31,32,33,34,35,36],"android","angular","cordova","customelements","html","hybrid-apps","ios","javascript","material","monaca","onsen-ui","pwa","react","vue","webcomponents","2026-06-12 02:02:16","\n\u003Cp align=\"center\">\u003Ca href=\"https:\u002F\u002Fonsen.io\u002F\" target=\"_blank\">\u003Cimg width=\"140\" src=\"https:\u002F\u002Fonsenui.github.io\u002Fart\u002Flogos\u002Fonsenui-logo-1.png\">\u003C\u002Fa>\u003C\u002Fp>\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fcircleci.com\u002Fgh\u002FOnsenUI\u002FOnsenUI\">\u003Cimg src=\"https:\u002F\u002Fcircleci.com\u002Fgh\u002FOnsenUI\u002FOnsenUI.svg?style=shield\" alt=\"Circle CI\">\u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fbadge.fury.io\u002Fjs\u002Fonsenui\">\u003Cimg src=\"https:\u002F\u002Fbadge.fury.io\u002Fjs\u002Fonsenui.svg\" alt=\"NPM version\">\u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Fcdnjs.com\u002Flibraries\u002Fonsen\">\u003Cimg src=\"https:\u002F\u002Fimg.shields.io\u002Fcdnjs\u002Fv\u002Fonsen.svg\" alt=\"CDNJS\">\u003C\u002Fa>\n\u003C\u002Fp>\n\n# [Onsen UI](https:\u002F\u002Fonsen.io\u002F) - Cross-Platform Hybrid App and PWA Framework\n\nOnsen UI is an \u003Cstrong>open source\u003C\u002Fstrong> framework that makes it easy to create native-feeling Progressive Web Apps (PWAs) and hybrid apps.\n\nThe core library is written in \u003Cstrong>pure Javascript\u003C\u002Fstrong> (on top of \u003Ca href=\"http:\u002F\u002Fwebcomponents.org\u002F\">Web Components\u003C\u002Fa>) and is \u003Cstrong>framework agnostic\u003C\u002Fstrong>, which means you can use it with your favorite framework and its tools. We provide some extra binding packages to make it easy to use Onsen UI's API with many popular frameworks:\n\n\u003Ctable>\n  \u003Ctbody>\u003Ctr>\n    \u003Ctd align=\"center\" width=\"150\">\u003Ca href=\"https:\u002F\u002Fonsen.io\u002Freact\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fcommon\u002Ficn_react_top.svg\" height=\"40\">\u003Cbr>\u003Cstrong>React\u003C\u002Fstrong>\u003C\u002Fa>\u003C\u002Ftd>\n    \u003Ctd align=\"center\" width=\"150\">\u003Ca href=\"https:\u002F\u002Fonsen.io\u002Fangular2\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fcommon\u002Ficn_angular2_top.svg\" height=\"40\">\u003Cbr>\u003Cstrong>Angular 2+\u003C\u002Fstrong>\u003C\u002Fa>\u003Cbr>\u003C\u002Ftd>\n    \u003Ctd align=\"center\" width=\"150\">\u003Ca href=\"https:\u002F\u002Fonsen.io\u002Fvue\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fcommon\u002Ficn_vuejs_top.svg\" height=\"40\">\u003Cbr>\u003Cstrong>Vue\u003C\u002Fstrong>\u003C\u002Fa>\u003Cbr>\u003C\u002Ftd>\n    \u003Ctd align=\"center\" width=\"150\">\u003Ca href=\"https:\u002F\u002Fonsen.io\u002Fv2\u002Fdocs\u002Fguide\u002Fangular1\u002Findex.html\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fcommon\u002Ficn_angular1_top.svg\" height=\"40\">\u003Cbr>\u003Cstrong>AngularJS 1.x\u003C\u002Fstrong>\u003C\u002Fa>\u003Cbr>\u003C\u002Ftd>\n  \u003C\u002Ftr>\u003C\u002Ftbody>\n\u003C\u002Ftable>\n\nSome other frameworks are supported by __community__ packages (not tested or implemented by the core team): [Aurelia](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Faurelia-onsenui), [EmberJS](https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fember-onsenui).\n\nBoth \u003Cstrong>flat (iOS) and Material (Android) designs\u003C\u002Fstrong> are included. The components are optionally auto-styled based on the platform, which makes it possible to support both iOS and Android with the \u003Cstrong>same source code\u003C\u002Fstrong>.\n\n\n## Getting started\nWe have several resources to help you get started creating hybrid apps and PWAs with Onsen UI:\n\n* __The official docs__: We provide guides and references for all of the components and bindings, as well as how to publish your app. These are our _Getting Started_ guides:\n  * [Core guide (no framework)](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide)\n  * [Vue guide](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fvue\u002F)\n  * [React guide](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Freact\u002F)\n  * [Angular 2+ guide](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fangular2\u002F)\n  * [AngularJS 1.x guide](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fangular1\u002F)\n  * [jQuery guide](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fjquery\u002F)\n  * [Creating an Onsen UI hybrid app using Cordova](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fhybrid\u002Fcordova.html)\n  * [Progressive Web Apps (PWAs) with Onsen UI](https:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002Fpwa\u002Fintro.html)\n* __Components overview__: a [list of included CSS components](https:\u002F\u002Fonsen.io\u002Fv2\u002Fdocs\u002Fcss.html) in both flat and Material Design. Note that these components are just pure and performant CSS without JavaScript behavior. Some extra details (such as dragging or ripple effect) are added by Onsen UI custom elements.\n* __Playground__: an [interactive Onsen UI tutorial](https:\u002F\u002Fonsen.io\u002Fplayground\u002F) where you can learn how to use Onsen UI and play around with the components.\n* __Blog__: there are lots of great tutorials and guides published in our [official Onsen UI blog](https:\u002F\u002Fonsen.io\u002Fblog\u002Fcategories\u002Ftutorial.html) and we are adding new content regularly.\n* __Support__: if you are having trouble using some component the best place to get help is the [Onsen UI Forum](https:\u002F\u002Fcommunity.onsen.io\u002F) or the community-run [Discord Chat](https:\u002F\u002Fdiscord.gg\u002FJWhBbnE). We are also available to answer short questions on Twitter at [@Onsen_UI](https:\u002F\u002Ftwitter.com\u002FOnsen_UI).\n\n## Get Onsen UI\n\n### __Download the latest released version__\nWe have a [distribution repository](https:\u002F\u002Fgithub.com\u002FOnsenUI\u002FOnsenUI-dist\u002Freleases) with changelog. Onsen UI is also available in __npm__ and __jspm__. Example:\n\n```bash\nnpm install onsenui\n```\n\nThis downloads the core Onsen UI library. To install bindings, you can install `react-onsenui`, `vue-onsenui`, `ngx-onsenui` or `angularjs-onsenui`.\n\n### __Download or request from a CDN__\nYou can also take the necessary files from a CDN. Some of the options are [unpkg](https:\u002F\u002Funpkg.com\u002Fonsenui\u002F), [jsDelivr](https:\u002F\u002Fwww.jsdelivr.com\u002Fpackage\u002Fnpm\u002Fonsenui) and [cdnjs](https:\u002F\u002Fcdnjs.com\u002Flibraries\u002Fonsen).\n\n### __Get the latest development build__\nOptionally, you can download the [latest development build here](https:\u002F\u002Fonsenui.github.io\u002Flatest-build). Be careful, usually everything there is already tested but it might be unstable sometimes.\n\n## Examples with source code\nThere are lots of sample applications written using Onsen UI. __[Here are some examples](https:\u002F\u002Fonsen.io\u002Fsamples) with source code and tutorials__ to give you an idea of what kind of apps you can create.\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fargelius.github.io\u002Fangular2-onsenui-pokedex\u002F\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fsamples\u002Fpokedex-pikachu.png\">\u003C\u002Fa>\n  \u003Ca href=\"http:\u002F\u002Fargelius.github.io\u002Freact-onsenui-redux-weather\u002Fdemo.html\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fsamples\u002Freact-redux-weather.png\">\u003C\u002Fa>\n  \u003Ca href=\"https:\u002F\u002Ffrandiox.github.io\u002FOnsenUI-YouTube\" target=\"_blank\">\u003Cimg src=\"https:\u002F\u002Fonsen.io\u002Fimages\u002Fsamples\u002Fyoutube.png\">\u003C\u002Fa>\n\u003C\u002Fp>\n\n## Onsen UI ecosystem\nBecause sometimes a UI framework may not be enough to make hybrid app development easy, Onsen UI comes with a __complete ecosystem__ of well integrated tools. Meet [__Monaca__](https:\u002F\u002Fmonaca.io\u002F).\n\n\u003Cp align=\"center\">\u003Ca href=\"https:\u002F\u002Fmonaca.io\" target=\"_blank\">\u003Cimg width=\"300\"src=\"https:\u002F\u002Fonsenui.github.io\u002Fart\u002Flogos\u002Fmonaca-logo-2.png\">\u003C\u002Fa>\u003C\u002Fp>\n\nDeveloped by the Onsen UI team, __Monaca__ is a toolkit that makes hybrid mobile app development with __PhoneGap \u002F Cordova__ simple and easy: Onsen UI Cordova templates, debugging suite, push notifications, remote build, back-end solutions, encryption, version control, continuous integration and more. Furthermore, it provides multiple development environments with everything already configured and ready to go:\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fmonaca.io\u002Fcloud.html\">\u003Cstrong>Cloud IDE\u003C\u002Fstrong>\u003C\u002Fa> -\n  \u003Ca href=\"https:\u002F\u002Fmonaca.io\u002Fcli.html\">\u003Cstrong>Command Line Interface\u003C\u002Fstrong>\u003C\u002Fa> -\n  \u003Ca href=\"https:\u002F\u002Fmonaca.io\u002Flocalkit.html\">\u003Cstrong>Localkit GUI\u003C\u002Fstrong>\u003C\u002Fa>\n\u003C\u002Fp>\n\nExample with __CLI__:\n\n```\n$ [sudo] npm -g install monaca\n$ monaca create helloworld # And choose the starter template\n$ monaca preview # Preview on the browser\n$ monaca debug # Preview on a real device\n$ monaca remote build --browser # Production build on the cloud\n```\n\nSee the [Onsen UI Getting Started Page](http:\u002F\u002Fonsen.io\u002Fv2\u002Fguide\u002F) for more information.\n\n## Browser Support\nOnsen UI is tested to work with the following browsers and mobile OS.\n\n * Android 4.4.4+\n * iOS 9+\n * Chrome\n * Safari\n\n## Contribution\nWe welcome your contribution, no matter how big or small! Please have a look at the [contribution guide](https:\u002F\u002Fgithub.com\u002FOnsenUI\u002FOnsenUI\u002Fblob\u002Fmaster\u002FCONTRIBUTING.md) for details about project structure, development environment, test suite, code style, etc. All the version updates are mentioned in the [changelog](https:\u002F\u002Fgithub.com\u002FOnsenUI\u002FOnsenUI\u002Fblob\u002Fmaster\u002FCHANGELOG.md).\n","Onsen UI 是一个用于开发跨平台移动应用和渐进式网页应用（PWA）的开源框架。它基于纯JavaScript编写，并利用Web Components技术，支持多种前端框架如Angular、React、Vue等，提供一致的API使用体验。该框架内置了iOS风格的扁平设计与Android风格的Material Design组件，能够根据目标平台自动调整样式，实现一套代码同时适配iOS和Android系统。适用于需要快速构建高性能、原生体验的混合应用或PWA场景。","2026-06-11 03:26:15","top_topic"]