Menu
Home
People
Places
Arts
History
Plants & Animals
Science
Life & Culture
Technology
Reference.org
Ionic (mobile app framework)
open-in-new
<h2 id="history">History</h2> <p>Ionic was created by Drifty Co. in 2013. After releasing an alpha version of the framework in November 2013, a 1.0 beta was released in March 2014, a 1.0 final in May 2015, and several 2.0 releases in 2016.<a class="footnote-ref" id="fnref:4" href="#fn:4"><sup>4</sup></a> </p><p>Since January 2019, Ionic 4 allows developers to choose other frameworks apart from Angular like React, Vue.js, and web components.<a class="footnote-ref" id="fnref:5" href="#fn:5"><sup>5</sup></a> Ionic 4 was built using StencilJS. Ionic was acquired by <a href="/facts/OutSystems/tW0gW57Y">OutSystems</a> in November 2022.<a class="footnote-ref" id="fnref:6" href="#fn:6"><sup>6</sup></a> </p> <h2 id="services-and-features">Services and features</h2> <p>Ionic uses <a href="/facts/Apache_Cordova/02wYWdWr">Cordova</a> and, more recently, Capacitor plugins to gain access to host operating systems features such as Camera, GPS, Flashlight, etc.<a class="footnote-ref" id="fnref:7" href="#fn:7"><sup>7</sup></a><a class="footnote-ref" id="fnref:8" href="#fn:8"><sup>8</sup></a><a class="footnote-ref" id="fnref:9" href="#fn:9"><sup>9</sup></a> Users can build their apps, and they can then be customized for <a href="/facts/Android_(operating_system)/nNyHb0xz">Android</a>, <a href="/facts/IOS/mK5cggH5">iOS</a>, <a href="/facts/Universal_Windows_Platform_apps/PCIgnSjM">Windows</a>, Desktop (with <a href="/facts/Electron_(software_framework)/15eHlAWQ">Electron</a>), or modern browsers.<a class="footnote-ref" id="fnref:10" href="#fn:10"><sup>10</sup></a> Ionic allows app building and deployment by wrapping around the build tool Cordova or Capacitor with a simplified 'ionic' command line tool.<a class="footnote-ref" id="fnref:11" href="#fn:11"><sup>11</sup></a> </p><p>Ionic includes mobile components, typography, interactive paradigms, and an extensible base theme.<a class="footnote-ref" id="fnref:12" href="#fn:12"><sup>12</sup></a> </p><p>Using Web Components, Ionic provides custom components and methods for interacting with them. One such component, virtual scroll, allows users to scroll through a list of thousands of items without any performance hits. Another component, tabs, creates a tabbed interface with support for native-style navigation and history state management. </p><p>Besides the SDK, Ionic also provides services that developers can use to enable features, such as <a href="/facts/Software_deployment/9yMpwGTu">code deploys</a>, <a href="/facts/Build_automation/gWwxNg5K">automated builds</a>. Ionic also provides its own <a href="/facts/Integrated_development_environment/jbEINSQf">IDE</a> known as Ionic Studio, but it was discontinued in 2020.<a class="footnote-ref" id="fnref:13" href="#fn:13"><sup>13</sup></a> </p><p>Ionic also provides a <a href="/facts/Command-line_interface/R9JpGmXQ">command-line interface (CLI)</a> to create projects. The CLI also allows developers to add Cordova plugins and additional front-end packages, enable push notifications, generate app Icons and <a href="/facts/Splash_screens/IVVb0GbV">Splash screens</a>, and build native binaries.<a class="footnote-ref" id="fnref:14" href="#fn:14"><sup>14</sup></a> </p> <h2 id="supported-platforms">Supported platforms</h2> <p>For Android, Ionic supports Android 4.4 and up. For iOS, Ionic supports iOS 10 and up.<a class="footnote-ref" id="fnref:15" href="#fn:15"><sup>15</sup></a> Ionic 2 supports the Universal Windows Platform for building <a href="/facts/Windows_10/be9IHehJ">Windows 10</a> apps.<a class="footnote-ref" id="fnref:16" href="#fn:16"><sup>16</sup></a> Ionic Framework, based on <i>Angular.js</i>, supports <a href="/facts/BlackBerry_10/WCev9y98">BlackBerry 10</a> apps.<a class="footnote-ref" id="fnref:17" href="#fn:17"><sup>17</sup></a> </p> <h2 id="performance">Performance</h2> <p>Ionic apps run with a mixture of native code and web code, providing full access to native functionality if necessary, with the bulk of the UI of the app built with standard web technology. Ionic utilizes native hardware acceleration features available in the browser (such as CSS animations) and optimizes rendering (avoiding expensive <a href="/facts/Document_Object_Model/GglE6jGx">DOM</a> manipulation). Ionic leverages CSS transitions and transforms for animation as a way to leverage the <a href="/facts/Graphical_processing_unit/PTK1RQVp">GPU</a> and maximize available processor time. </p> <h2 id="installation">Installation</h2> <p>Ionic is an <a href="/facts/Npm_(software)/wJg3ebn2">npm module</a> and requires <a href="/facts/Node.js/FKzhV4Qa">Node.js</a>.<a class="footnote-ref" id="fnref:18" href="#fn:18"><sup>18</sup></a> </p> <h2 id="external-links">External links</h2> <ul><li><a href="https://ionicframework.com/">Ionic Framework</a></li> <li><a href="https://sdk.docutain.com/blogartikel/cordova-versus-capacitor">Cordova vs Capacitor: A Comparison in Building Ionic Framework Apps</a></li></ul> <h2 id="references">References</h2> <ol> <li id="fn:1"><p>Drifty, Inc (2016). "Ionic Documentation Overview - License". <a href="https://ionicframework.com/docs/overview/#license" target="_blank">https://ionicframework.com/docs/overview/#license</a> <a href="#fnref:1" class="footnote-back-ref">↩</a></p></li> <li id="fn:2"><p>"Introducing Ionic 4: Ionic for Everyone". 23 January 2019. <a href="https://blog.ionicframework.com/introducing-ionic-4-ionic-for-everyone/" target="_blank">https://blog.ionicframework.com/introducing-ionic-4-ionic-for-everyone/</a> <a href="#fnref:2" class="footnote-back-ref">↩</a></p></li> <li id="fn:3"><p>Drifty. "Ionic Framework". Retrieved 16 July 2017. <a href="https://ionicframework.com/docs/intro/concepts/" target="_blank">https://ionicframework.com/docs/intro/concepts/</a> <a href="#fnref:3" class="footnote-back-ref">↩</a></p></li> <li id="fn:4"><p>"Best Ionic App Development Company | Hire Ionic Developers". www.crystalinfoway.com. Retrieved 5 July 2023. <a href="https://www.crystalinfoway.com/ionic-app-development-company" target="_blank">https://www.crystalinfoway.com/ionic-app-development-company</a> <a href="#fnref:4" class="footnote-back-ref">↩</a></p></li> <li id="fn:5"><p>"Comparing v4.0.0-rc.3/v4.0.0 · ionic-team/ionic-framework". GitHub. <a href="https://github.com/ionic-team/ionic-framework/compare/v4.0.0-rc.3...v4.0.0" target="_blank">https://github.com/ionic-team/ionic-framework/compare/v4.0.0-rc.3...v4.0.0</a> <a href="#fnref:5" class="footnote-back-ref">↩</a></p></li> <li id="fn:6"><p>"OutSystems Acquires Ionic to Unite the Power of Open Source Mobile Development with High-Performance Low-Code". <a href="https://www.businesswire.com/news/home/20221107005221/en/OutSystems-Acquires-Ionic-to-Unite-the-Power-of-Open-Source-Mobile-Development-with-High-Performance-Low-Code" target="_blank">https://www.businesswire.com/news/home/20221107005221/en/OutSystems-Acquires-Ionic-to-Unite-the-Power-of-Open-Source-Mobile-Development-with-High-Performance-Low-Code</a> <a href="#fnref:6" class="footnote-back-ref">↩</a></p></li> <li id="fn:7"><p>"Cordova Plugins". docs.usecreator.com. Retrieved 2 June 2018. <a href="https://docs.usecreator.com/docs/how-to-use-cordova-plugins-with-your-creator-app" target="_blank">https://docs.usecreator.com/docs/how-to-use-cordova-plugins-with-your-creator-app</a> <a href="#fnref:7" class="footnote-back-ref">↩</a></p></li> <li id="fn:8"><p>"Attractive Features Of Ionic App Development Framework". Retrieved 2 June 2018. <a href="https://www.mytechlogy.com/IT-blogs/15907/attractive-features-of-ionic-app-development-framework/" target="_blank">https://www.mytechlogy.com/IT-blogs/15907/attractive-features-of-ionic-app-development-framework/</a> <a href="#fnref:8" class="footnote-back-ref">↩</a></p></li> <li id="fn:9"><p>Drifty. "Ionic Framework". Archived from the original on 14 November 2019. Retrieved 2 June 2018. <a href="https://web.archive.org/web/20191114171958/https://ionicframework.com/docs/native" target="_blank">https://web.archive.org/web/20191114171958/https://ionicframework.com/docs/native</a> <a href="#fnref:9" class="footnote-back-ref">↩</a></p></li> <li id="fn:10"><p>Drifty. "Ionic Framework". Retrieved 2 June 2018. <a href="https://ionicframework.com/docs/intro/browser-support/" target="_blank">https://ionicframework.com/docs/intro/browser-support/</a> <a href="#fnref:10" class="footnote-back-ref">↩</a></p></li> <li id="fn:11"><p>"Mastering the Ionic Framework: Learn to Build & Deploy Native Speed HTML5 Based Apps - Thinkster". thinkster.io. Retrieved 2 June 2018. <a href="https://thinkster.io/ionic-framework-tutorial" target="_blank">https://thinkster.io/ionic-framework-tutorial</a> <a href="#fnref:11" class="footnote-back-ref">↩</a></p></li> <li id="fn:12"><p>Ionic. "Theming Basics - Ionic Documentation". Ionic Docs. Retrieved 26 November 2019. <a href="https://ionicframework.com/docs/theming/basics" target="_blank">https://ionicframework.com/docs/theming/basics</a> <a href="#fnref:12" class="footnote-back-ref">↩</a></p></li> <li id="fn:13"><p>"Ionic Studio is DeaD". Retrieved 10 May 2023. <a href="https://www.reddit.com/r/ionic/comments/jkk45i/comment/gamii1b" target="_blank">https://www.reddit.com/r/ionic/comments/jkk45i/comment/gamii1b</a> <a href="#fnref:13" class="footnote-back-ref">↩</a></p></li> <li id="fn:14"><p>Ionic. "Installing Ionic - Ionic Documentation". Ionic Docs. Retrieved 26 November 2019. <a href="https://ionicframework.com/docs/installation/cli" target="_blank">https://ionicframework.com/docs/installation/cli</a> <a href="#fnref:14" class="footnote-back-ref">↩</a></p></li> <li id="fn:15"><p>"Browser Support - Ionic Documentation". Retrieved 19 December 2019. <a href="https://ionicframework.com/docs/intro/browser-support" target="_blank">https://ionicframework.com/docs/intro/browser-support</a> <a href="#fnref:15" class="footnote-back-ref">↩</a></p></li> <li id="fn:16"><p>"Announcing Windows Support in Ionic 2". 29 March 2016. Retrieved 22 April 2016. <a href="http://blog.ionic.io/announcing-windows-support-in-ionic-2/" target="_blank">http://blog.ionic.io/announcing-windows-support-in-ionic-2/</a> <a href="#fnref:16" class="footnote-back-ref">↩</a></p></li> <li id="fn:17"><p>"Top JavaScript Frameworks for Enterprise Mobility". Retrieved 21 September 2015. <a href="http://devblog.blackberry.com/2015/07/top-javascript-frameworks-for-enterprise-mobility-part-13/" target="_blank">http://devblog.blackberry.com/2015/07/top-javascript-frameworks-for-enterprise-mobility-part-13/</a> <a href="#fnref:17" class="footnote-back-ref">↩</a></p></li> <li id="fn:18"><p>"Free Mobile App Development: Getting Started with Ionic Apps". <a href="https://ionicframework.com/getting-started" target="_blank">https://ionicframework.com/getting-started</a> <a href="#fnref:18" class="footnote-back-ref">↩</a></p></li> </ol>