• Save
Web based, mobile enterprise applications
Upcoming SlideShare
Loading in...5

Web based, mobile enterprise applications



What are enterprise apps? should you build a native or a html5 mobile app?

What are enterprise apps? should you build a native or a html5 mobile app?
How is the performance of HTML5 on mobile and other lessons learnt form building web based mobile apps for enterprises.



Total Views
Views on SlideShare
Embed Views



7 Embeds 43

http://html5devconf.com 17
http://www.linkedin.com 11
https://www.linkedin.com 7
https://twitter.com 5
http://localhost 1
http://dev.liranuna.com 1
http://www.html5devconf.com 1



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • How are we all doing? The only thing better than picturing yourself in this photo is attending this conference – correct?You know, I come to these conferences and listen to really smart people give brilliant presentations. No matter how hard I try, I always end up learning something cool. However, this one topic – building enterprise apps for really large enterprises is a topic not covered very well. Hi all, I am Manish Garg. I have been building enterprise applications for more than 10 years. I am an architect and I focus on building web based mobile applications for enterprise use case. Let me share a secret with you – this is where the money is.Appeal to entrepreneurs: So many times I am approached by entrepreneurs who are working on enterprise use cases and I hope some of you will also find this presentation interestingB2B2C: You are already using enterprise apps. I will only share some of my personal experiences which developing real enterprise apps on mobile using web rather than native apps.Why I feel passionate about this topic – Most web frameworks address single application situations but not scenarios that span a suite of hundreds of apps.If we are to get serious about web apps on mobile, there is still work to be done.How many of you develop software used by really large companies? Or maybe work at really large companiesTime: 1.30
  • What are enterprise applications, what are some of the common standards for enterprise apps.How can they be built – Native or Web based ..Two of the standards I have been working on most recently45 secondsTotal - 2:15
  • Mobile is an augmentation of physical and personal capabilityDemocratization because employees are free to choose AWS, Github, Basecamp, …Consumerization because we are increasingly using state of the art applications for personal use and don’t like the difference in UX when compared to enterprise apps.
  • Let’s set the context first. What kind of application am I talking about?BTW, enterprise apps touches your life in more ways than you can imagine. Who has done online banking or paid utilities … These are the applications and processes make sure that enough chocolate is produced in the world, the latest designer jeans are made and shipped from places that will remain unnamedSo that Nike knows how much to charge you for the newest LunarGlide and so that BMW knows when will the thousands of parts for your M5 will arrive.[3:45]
  • Things can start to get very serious very quickly.[04:35]
  • Shipped applicationsmeans – maintain upgrades across different versionsSupport different versions and customizationsInternal release cyclesMargin for error is really low – since fixing a problem is very expensive. Cannot just build and deploy and test a feature that easilyDifferent versions at different customers customers make the shipped apps more tricky to handleExtensibility:First thing a customer says – ‘This is great but how can change the header, footer, and add these 5 fields, hide some other fields’ And also make sure the next time you provide me a patch none of my changes are effected[7:30]
  • Security, umeUpgrade pack… Appliacation migrationOverride the definition file[11]
  • Graphic intensive apps, games – go nativeFor enterprise apps, HTML5 is a great choice.Facebook had recently announced that HTML5 for mobile is not there yet. Even mom and pop stores have their own apps now.
  • Captive audience
  • How many have you built web apps for mobileHow many of you have measured the perf. of this mobile web app?There are inbuilt performance measure measurement tools in Safari, xCode and Google Refine to measure the performance
  • Thanks to Google for finally giving Chrome on mobile3-5 Mbps vs 20 – 30 MbpsContent and images not optimized for mobileToo many IOsTransmission negotiation (~1 sec wake up time)CPU, GPU, memoryAnimations can quickly drain the batteryIn our testsCPU profiling on a mobile yielded very different results. Repaint on screen resize killed the CPU
  • There are excellent videos and blogs online that you should look at.
  • What is it and why does anyone need it?We talked earlier that many times enterprise apps have to be shipped. Even if they were just hosted, almost everytime, the first thing a customer wants is to start changing the app to fit their internal processes and their data objects and fields. Also different countries have different processes for the same company.This is not really an option but almost a mandatory requirement when selling to large enterprises.
  • In technical terms, it means that once a customer agrees to start using the app and now wants to modify it, they have to do something on the UIService layerBackendLets focus mostly on the UI. You also have to remember, that many times, mobile apps are built for specific intent and have been carefully designed to not overwhelm the user. This means we don’t want to necessarily have a have it all – do it all approach for Extensibility. It has to be deliberate but also flexible.If this is the approach you want to take, then the original app can have extensibility points. Specific points in the UI where you can add fields or manipulate the viewThen the extension app can be written against this original app. Think of this pattern as having an interface and and implementation. Don’t forget that the user can also add completely new Views and also add new navigation URL targets. Which means that the JS lib. Should be able to support these patterns.
  • Also support different systems in the backend (e.g. HR )..
  • Understand whom you are designing for. Power users, executives, casual users, people on the road?
  • Lessons learnt

Web based, mobile enterprise applications Web based, mobile enterprise applications Presentation Transcript

  • 2 What are we going to cover 1. 2. 3. 4. What are enterprise applications Native vs web based apps Performance Customization – often ignored but always required
  • 3 1. 2. 3. 4. What are enterprise applications Native vs web based apps Performance Customization – often ignored but always required
  • 4 What is happening in Enterprise     Democratization and Consumerization of IT Shift from features and functionality to design Mobile and bring your own device Companies have direct access to enterprise users
  • 5 1. Enterprise apps   Mission critical applications that power the large companies Think of manufacturing, retail, banking, automotive, public sector, defense, …
  • 6 Now think of 1000s of companies running 100s of processes
  • 7 How are enterprise apps different?         Design driven; consistency in design We are not talking about single web app May not hosted be but shipped Need for extensibility (and support upgrades) Robust, Responsive User management and LDAP integration Downtime management Security, authentication, authorization
  • 8 Architectural requirements checklist 1. 2. 3. 4. 5. 6. 7. 8. 9. Responsive design Security, SSO integration Globalization and internationalization Native Vs. Web Based Performance Customization or Extensible Integrate with customer landscape Open source and 3rd party legal compliance …
  • 9 1. 2. 3. 4. What are enterprise applications Native vs web based apps Performance Customization – often ignored but always required
  • 10 Native or HTML5 BIG decision Depends on the use case
  • 11 HTML5 is great for most use cases   80% of the functionality can be covered, including graphs 20% needs native support  Image processing  Barcode scanning  Access to some other H/W features  Offline
  • 12 HTML5 – Design impact PROS  Consistent design and UX  Designers can provide several development assets (CSS, HTML, …) CONS  Smooth animations and transitions difficult to achieve  Design had to be adjusted to accommodate performance or missing native support  Performance
  • 13 HTML5 - Development and Testing PROS  Development time and cost is low  Easier when large development teams are working together  Testing is easier CONS   Simple goals turned into huge tasks (scrolling, …) Testing across many devices is still a pain
  • 14 HTML5 – Life cycle management PROS  One code base to maintain  Easy to distribute  Supports desktop automatically CONS Many changes expected
  • 15 1. 2. 3. 4. What are enterprise applications Native vs web based apps Performance Customization – often ignored but always required
  • 16 HTML5 Performance  Performance is very important ~40-50% ~80% Out of every 1000 users 400 never come back if performance is bad
  • 17 Performance mobile.webapp.perf() < desktop.webapp.perf() && mobile.webapp.perf() < nativeapp.perf() But why?
  • Mobile HTML5 performance bottlenecks 1. 2. 3. Network Mobile resource and compute is different Browsers are lagging  Desktop browsers are far ahead than the mobile browsers 4. 5. Caching and local storage. Debugging and profiling 18
  • 19 Repaint CPU profile on Xcode
  • 20 Tools 1. 2. 3. 4. 5. 6. Network tab in Developer view of browsers Profiling functionality in your browsers Xcode profiling chrome://tracing/ Yslow originally from Yahoo Google Refine, now called Open Refine – to analyze the performance logs
  • 21 1. 2. 3. 4. What are enterprise applications Native vs web based apps Performance Customization – often ignored but always required
  • 22 Application Customization
  • 23 Architectural impact     Provide hook points in the original app Create an extension app, which has all the context from the original app New views and navigations are game Run time aggregation versus build time aggregation Think of AngularJs Directives
  • 24 Runtime Vs. Buildtime merge   DOM manipulation as the different views are fetched and interpreted by the JS lib Run a build script to merge the Views to improve runtime performance
  • 25 Don’t forget     To allow extensions in your service layer Backend Know your service and how much data it returns. Customization != Personalization
  • 26 What else have we learnt?
  • 27 Summary of lessons learnt DESIGN  Design driven apps: Understanding the user  Everything is changing DEVELOPMENT  Web based apps are faster to develop on a large scale  Batch reads and writes are faster  Allow for easy application extensions  Declarative programming works better in many scenarios
  • 28 Declarative navigation
  • 29     Hire rock star CSS experts No JS library is a silver bullet. You will end up using several of them and they all have to be integrated You will spend a lot of time with JS lib exploration Hardware acceleration  Use -webkit-transform: translate3d
  • 30 SUPPORTABILITY OF APPS  Error codes have to much more informative  The system trace has to be there .. Is it on the server, backend, UI … TESTING  Keep an eye on performance – always  Don’t wait to test on mobile
  • Thank you for listening. I am done… What else do you want to talk about? Manish Garg @manishgarg 31