SlideShare a Scribd company logo
LinkedIn Mobile

Lessons from Building
Culture
   Product & Design
Development Background
     Our Choices
        Server
        Client
Cult of Simple
• Fast
  – App Launch
  – Screen to Screen Switch
• Easy
  – Tap Count
• Reliable
  – Don’t Crash
  – Repeatable
Product & Design

It impacts engineering
Websites vs. Applications


 Content Focus      Flow & Action Focus

Long Form Layout        Lists/Details



          Responsive Design
Good for websites; Not for applications
Interaction vs. Visual
• Design a house floor plan
• Focus on Rooms and Hallways
• Stay away from Paint, Furniture Carpet
• Has & Does for each screen
• Black & White then Color
Adjust App Platforms

• On Screen vs. Hardware Back

• Up vs. Back / Stacks vs. Pages

• Pull to Refresh vs. Button Refresh

• Settings Room Location

• Visual Design
Development Background

   Approach to Engineering
HTML5 vs Native

• What is the skillset of the team?

• What is your front door?

• Which platforms are you targeting?

• Phone Gap vs Titanium vs XXX
Libs vs. Frameworks



Frameworks call   App call libraries
   your app
    (Few)              (Lots)
Process vs Evented
     Systems
Process Systems

  Single process/thread per request

Block while waiting for I/O to complete

      Use Process/Thread Pools
Evented Systems


Single Process for large number of requests

           Non Blocking for I/O

Use 1 Process per Core on system for scale
Evented For Mobile

Process Systems great for high compute

 Evented Systems great for I/O bound

    With mobile client rendering,
  evented systems best for front end
Our Choices
Server
Mobile Server
•   Scaling Node
•   Node Modules
•   Logging vs Tracking vs Metrics
•   File Structure / Code Size
•   Client / Server Line Format
•   Server / Server Line Format
•   Latency vs Bandwidth
•   Gotchas
Scaling

• Load Balancer talking to each node instance
  running on separate cores
• In Node .8, finally have master/child file
  handle sharing based evented model
• 150 qps per core per instance
• 60 MB of RAM for an instance
Node Modules
•   Step to Async
•   Express/Connect -- Framework
•   Vows to Mocha
•   Request
•   Underscore
Logging/Monitoring/Tracking
• Logging used for sending lots of text information
   – useful for debugging

• Monitoring is for sending counters for realtime
  monitoring: Product and System
   – Typical: Query Rate, Response Code, Time for
     request, Page Views, Actions
   – Cube from Square

• Tracking is for product metric queries
   – Get into a database for queries
   – Needed for doing Uniqing and Pathing queries
File Structure / Code Size


• Follow simple Rails/Django dir
  – Controllers, Helpers, Formatters, Templates

  – No Views, No Models

• Code Size ~ 10K
Client / Server Line Level

•   Single Request per screen
•   JSON is template based
•   Updateable on Server
•   Don’t add:
    – Links
    – Styles
    – Positioning
• Node is part of the client
  NOT the server
Server / Server Line Level Format
• Stream Data
  – Metrics, Logging, Events, etc
  – Kafka, Thrift, Avro, Protocol Buffers etc.
• Request/Response Data
  – HTTP/JSON
  – REST Endpoints for actual data models
  – Not much faster for performance
Latency vs. Bandwidth
• Latency is the issue with mobile not
  bandwidth
• Establish and keep the socket open for ping
• Use a ping and pull model not a true push
• Easier to scale ping/pull model
Node Gotchas
• Exception Handling
• Don’t listen on startup till you are connected
  to down stream services
• Okay to die and respawn
• httpClient.agent = false
• Turn on console in production
• NO BLOCKING!
Client
 Native for Infinite Scroll

Native for Window Manger

HTML5 for everything else
iOS / Android Native
Native Gotchas

Web to Native Messaging

Cache/Image Management

      Tools / Test
Web to Native Messaging
• iFrame with URL for Ping

• Native Pulls from Queue

• Web-Sockets suck

• REST for Native Services
Cache/Image Management

• Store all data in url/result hash

• Render data from Hash

• Render again from server response

• Image src should be set to small image when
  off screen
Tools/Test
•   iWebInspector / Weinre
•   Charles Proxy for req debugging
•   Pain when OS upgrade
•   Selenium with Safari Simulator (Web Parts)
•   Instruments UIAutomation / Robotium (Native)
•   Layout Test: DumpRender + ImageDiff (5%)
•   Vcr.js – Fixture Creater
•   Android Emulator Super Slow to have to do on
    build machine with catchup
Mobile Web
Screen vs Page
• App is multiple Screens in one page
• Page is a browser Page and has an implication
  of JS Load/Parse time
• Screen to Screen move is div show/hide
Backbone.js
• Controls Routing from Screen to Screen
• Controls Screen lifecycle (load, show, hide)
• Controls View Updating based on Model
  Change
• Has Model construct for Validation
• BaseRouter to Backbone
  – Transitions, screen life cycle
• M V C links in Backbone lead to mem leaks
Libraries
• Zepto – Manipulate the DOM
• iScroll – Inertial Scrolling on iOS
   – Does not work on Android
   – Pull to Refresh
• Underscore – Collection helpers and binding
  constructs, templating
Build / Packaging
• Closure
  – Minify, Comment Removal, Template Compilation
• SASS
  – Variables, Functions, Selector Inheritance
• Bundle (set of screens)
  – Local, Template, Controllers/Views
• Build independently and resuable
Startup
• Initial
   –   Index.html
   –   List of bundle files
   –   Store all in Local Storage
   –   Backbone starts home bundle
• Upgrade
   –   Index.html
   –   MD5 has for each file
   –   Compare/Download Diff
   –   Store in Local Storage
Tools / Gotchas
• Chrome Memory Profiler
  – https://developers.google.com/chrome-
    developer-tools/docs/heap-profiling
• Memory Leak Tracking
  – http://gent.ilcore.com/2011/08/finding-memory-
    leaks.html
• Hardware Acceleration for DIV render only on
  screen DIV’s
• Double Render from Cache

More Related Content

What's hot

Why XAF and XPO?
Why XAF and XPO?Why XAF and XPO?
Why XAF and XPO?
Jose Javier Columbie
 
Cross-Platform Mobile Development - Technical Stuff
Cross-Platform Mobile Development - Technical StuffCross-Platform Mobile Development - Technical Stuff
Cross-Platform Mobile Development - Technical Stuff
Akash Kubavat
 
How to ease the learning curve
How to ease the learning curveHow to ease the learning curve
How to ease the learning curve
Jose Javier Columbie
 
Web services automation workshop sreedhar dakshinamurthy
Web services automation workshop   sreedhar dakshinamurthyWeb services automation workshop   sreedhar dakshinamurthy
Web services automation workshop sreedhar dakshinamurthy
vodQA
 
Web services automation workshop sreedhar dakshinamurthy
Web services automation workshop   sreedhar dakshinamurthyWeb services automation workshop   sreedhar dakshinamurthy
Web services automation workshop sreedhar dakshinamurthy
Thoughtworks
 
MicroServices on Azure
MicroServices on AzureMicroServices on Azure
MicroServices on Azure
Sergey Seletsky
 
Service-oriented architecture
Service-oriented architectureService-oriented architecture
Service-oriented architecture
Shalva Usubov
 
Rvrsit
RvrsitRvrsit
Inland Empire .NET User's Group Silverlight Class
Inland Empire .NET User's Group Silverlight ClassInland Empire .NET User's Group Silverlight Class
Inland Empire .NET User's Group Silverlight Class
iedotnetug
 
Gwt cdi jud_con_berlin
Gwt cdi jud_con_berlinGwt cdi jud_con_berlin
Gwt cdi jud_con_berlin
hbraun
 
Seattle JS Meetup - Grunt EJS Static Presentation
Seattle JS Meetup - Grunt EJS Static PresentationSeattle JS Meetup - Grunt EJS Static Presentation
Seattle JS Meetup - Grunt EJS Static Presentation
Shae Kuronen
 
Using the Cascade Server Web Service API, by Artur Tomusiak
Using the Cascade Server Web Service API, by Artur TomusiakUsing the Cascade Server Web Service API, by Artur Tomusiak
Using the Cascade Server Web Service API, by Artur Tomusiak
hannonhill
 
Micro Services in .NET Core and Docker
Micro Services in .NET Core and DockerMicro Services in .NET Core and Docker
Micro Services in .NET Core and Docker
cjmyers
 
Javascript for Wep Apps
Javascript for Wep AppsJavascript for Wep Apps
Javascript for Wep Apps
Michael Puckett
 
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the WebUsing Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Web
philogb
 
Node and Micro-Services at IBM
Node and Micro-Services at IBMNode and Micro-Services at IBM
Node and Micro-Services at IBM
Dejan Glozic
 
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA ( PROJECT PRESENT...
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA   (  PROJECT PRESENT...EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA   (  PROJECT PRESENT...
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA ( PROJECT PRESENT...
joel9vvs
 
Sinatra and Heroku - A comfortable ruby way for web service
Sinatra and Heroku - A comfortable ruby way for web serviceSinatra and Heroku - A comfortable ruby way for web service
Sinatra and Heroku - A comfortable ruby way for web service
Tony Zhang
 
Microservices in Azure
Microservices in AzureMicroservices in Azure
Microservices in Azure
Doug Vanderweide
 
Spring framework v2
Spring framework v2Spring framework v2
Spring framework v2
Yaroslav Hulaga
 

What's hot (20)

Why XAF and XPO?
Why XAF and XPO?Why XAF and XPO?
Why XAF and XPO?
 
Cross-Platform Mobile Development - Technical Stuff
Cross-Platform Mobile Development - Technical StuffCross-Platform Mobile Development - Technical Stuff
Cross-Platform Mobile Development - Technical Stuff
 
How to ease the learning curve
How to ease the learning curveHow to ease the learning curve
How to ease the learning curve
 
Web services automation workshop sreedhar dakshinamurthy
Web services automation workshop   sreedhar dakshinamurthyWeb services automation workshop   sreedhar dakshinamurthy
Web services automation workshop sreedhar dakshinamurthy
 
Web services automation workshop sreedhar dakshinamurthy
Web services automation workshop   sreedhar dakshinamurthyWeb services automation workshop   sreedhar dakshinamurthy
Web services automation workshop sreedhar dakshinamurthy
 
MicroServices on Azure
MicroServices on AzureMicroServices on Azure
MicroServices on Azure
 
Service-oriented architecture
Service-oriented architectureService-oriented architecture
Service-oriented architecture
 
Rvrsit
RvrsitRvrsit
Rvrsit
 
Inland Empire .NET User's Group Silverlight Class
Inland Empire .NET User's Group Silverlight ClassInland Empire .NET User's Group Silverlight Class
Inland Empire .NET User's Group Silverlight Class
 
Gwt cdi jud_con_berlin
Gwt cdi jud_con_berlinGwt cdi jud_con_berlin
Gwt cdi jud_con_berlin
 
Seattle JS Meetup - Grunt EJS Static Presentation
Seattle JS Meetup - Grunt EJS Static PresentationSeattle JS Meetup - Grunt EJS Static Presentation
Seattle JS Meetup - Grunt EJS Static Presentation
 
Using the Cascade Server Web Service API, by Artur Tomusiak
Using the Cascade Server Web Service API, by Artur TomusiakUsing the Cascade Server Web Service API, by Artur Tomusiak
Using the Cascade Server Web Service API, by Artur Tomusiak
 
Micro Services in .NET Core and Docker
Micro Services in .NET Core and DockerMicro Services in .NET Core and Docker
Micro Services in .NET Core and Docker
 
Javascript for Wep Apps
Javascript for Wep AppsJavascript for Wep Apps
Javascript for Wep Apps
 
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the WebUsing Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Web
 
Node and Micro-Services at IBM
Node and Micro-Services at IBMNode and Micro-Services at IBM
Node and Micro-Services at IBM
 
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA ( PROJECT PRESENT...
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA   (  PROJECT PRESENT...EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA   (  PROJECT PRESENT...
EFFICIENT AND SECURE MULTI-KEY-WORD SEARCH ON LARGE DATA ( PROJECT PRESENT...
 
Sinatra and Heroku - A comfortable ruby way for web service
Sinatra and Heroku - A comfortable ruby way for web serviceSinatra and Heroku - A comfortable ruby way for web service
Sinatra and Heroku - A comfortable ruby way for web service
 
Microservices in Azure
Microservices in AzureMicroservices in Azure
Microservices in Azure
 
Spring framework v2
Spring framework v2Spring framework v2
Spring framework v2
 

Similar to Mobile gotcha

Building Enterprise Grade Front-End Applications with JavaScript Frameworks
Building Enterprise Grade Front-End Applications with JavaScript FrameworksBuilding Enterprise Grade Front-End Applications with JavaScript Frameworks
Building Enterprise Grade Front-End Applications with JavaScript Frameworks
FITC
 
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
Serdar Basegmez
 
Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!
Jeremy Likness
 
Proud to be polyglot
Proud to be polyglotProud to be polyglot
Proud to be polyglot
Tugdual Grall
 
Development of concurrent services using In-Memory Data Grids
Development of concurrent services using In-Memory Data GridsDevelopment of concurrent services using In-Memory Data Grids
Development of concurrent services using In-Memory Data Grids
jlorenzocima
 
New Approaches to Faster Oracle Forms System Performance
New Approaches to Faster Oracle Forms System PerformanceNew Approaches to Faster Oracle Forms System Performance
New Approaches to Faster Oracle Forms System Performance
Correlsense
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
IT Arena
 
20120306 dublin js
20120306 dublin js20120306 dublin js
20120306 dublin js
Richard Rodger
 
Machine Learning for Smarter Apps - Jacksonville Meetup
Machine Learning for Smarter Apps - Jacksonville MeetupMachine Learning for Smarter Apps - Jacksonville Meetup
Machine Learning for Smarter Apps - Jacksonville Meetup
Sri Ambati
 
Building azure applications ireland
Building azure applications irelandBuilding azure applications ireland
Building azure applications ireland
Michael Meagher
 
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
Vikas Sahni
 
After the LAMP, it's time to get MEAN
After the LAMP, it's time to get MEANAfter the LAMP, it's time to get MEAN
After the LAMP, it's time to get MEAN
Jeff Fox
 
Node.js BFFs: our way to better/micro frontends
Node.js BFFs: our way to better/micro frontendsNode.js BFFs: our way to better/micro frontends
Node.js BFFs: our way to better/micro frontends
Eugene Fidelin
 
Scaling Systems: Architectures that grow
Scaling Systems: Architectures that growScaling Systems: Architectures that grow
Scaling Systems: Architectures that grow
Gibraltar Software
 
API Architecture Summit 2014- APIs: A Mobile Developer's Perspective
API Architecture Summit 2014- APIs: A Mobile Developer's PerspectiveAPI Architecture Summit 2014- APIs: A Mobile Developer's Perspective
API Architecture Summit 2014- APIs: A Mobile Developer's Perspective
Niall Roche
 
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and AngularEscaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
Mark Leusink
 
Web Performance Optimization (WPO)
Web Performance Optimization (WPO)Web Performance Optimization (WPO)
Web Performance Optimization (WPO)
Betclic Everest Group Tech Team
 
Scalability and performance for e commerce
Scalability and performance for e commerceScalability and performance for e commerce
Scalability and performance for e commerce
Ecommerce Solution Provider SysIQ
 
Web frameworks don't matter
Web frameworks don't matterWeb frameworks don't matter
Web frameworks don't matter
Tomas Doran
 
Pros & Cons of Microservices Architecture
Pros & Cons of Microservices ArchitecturePros & Cons of Microservices Architecture
Pros & Cons of Microservices Architecture
Ashwini Kuntamukkala
 

Similar to Mobile gotcha (20)

Building Enterprise Grade Front-End Applications with JavaScript Frameworks
Building Enterprise Grade Front-End Applications with JavaScript FrameworksBuilding Enterprise Grade Front-End Applications with JavaScript Frameworks
Building Enterprise Grade Front-End Applications with JavaScript Frameworks
 
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
IBM Connect 2017: Your Data In the Major Leagues: A Practical Guide to REST S...
 
Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!Single Page Applications: Your Browser is the OS!
Single Page Applications: Your Browser is the OS!
 
Proud to be polyglot
Proud to be polyglotProud to be polyglot
Proud to be polyglot
 
Development of concurrent services using In-Memory Data Grids
Development of concurrent services using In-Memory Data GridsDevelopment of concurrent services using In-Memory Data Grids
Development of concurrent services using In-Memory Data Grids
 
New Approaches to Faster Oracle Forms System Performance
New Approaches to Faster Oracle Forms System PerformanceNew Approaches to Faster Oracle Forms System Performance
New Approaches to Faster Oracle Forms System Performance
 
Meetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech PeopleMeetup. Technologies Intro for Non-Tech People
Meetup. Technologies Intro for Non-Tech People
 
20120306 dublin js
20120306 dublin js20120306 dublin js
20120306 dublin js
 
Machine Learning for Smarter Apps - Jacksonville Meetup
Machine Learning for Smarter Apps - Jacksonville MeetupMachine Learning for Smarter Apps - Jacksonville Meetup
Machine Learning for Smarter Apps - Jacksonville Meetup
 
Building azure applications ireland
Building azure applications irelandBuilding azure applications ireland
Building azure applications ireland
 
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
Building Real World Applications using Windows Azure - Scott Guthrie, 2nd Dec...
 
After the LAMP, it's time to get MEAN
After the LAMP, it's time to get MEANAfter the LAMP, it's time to get MEAN
After the LAMP, it's time to get MEAN
 
Node.js BFFs: our way to better/micro frontends
Node.js BFFs: our way to better/micro frontendsNode.js BFFs: our way to better/micro frontends
Node.js BFFs: our way to better/micro frontends
 
Scaling Systems: Architectures that grow
Scaling Systems: Architectures that growScaling Systems: Architectures that grow
Scaling Systems: Architectures that grow
 
API Architecture Summit 2014- APIs: A Mobile Developer's Perspective
API Architecture Summit 2014- APIs: A Mobile Developer's PerspectiveAPI Architecture Summit 2014- APIs: A Mobile Developer's Perspective
API Architecture Summit 2014- APIs: A Mobile Developer's Perspective
 
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and AngularEscaping the yellow bubble - rewriting Domino using MongoDb and Angular
Escaping the yellow bubble - rewriting Domino using MongoDb and Angular
 
Web Performance Optimization (WPO)
Web Performance Optimization (WPO)Web Performance Optimization (WPO)
Web Performance Optimization (WPO)
 
Scalability and performance for e commerce
Scalability and performance for e commerceScalability and performance for e commerce
Scalability and performance for e commerce
 
Web frameworks don't matter
Web frameworks don't matterWeb frameworks don't matter
Web frameworks don't matter
 
Pros & Cons of Microservices Architecture
Pros & Cons of Microservices ArchitecturePros & Cons of Microservices Architecture
Pros & Cons of Microservices Architecture
 

Recently uploaded

Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)
Jakub Marek
 
How to use Firebase Data Connect For Flutter
How to use Firebase Data Connect For FlutterHow to use Firebase Data Connect For Flutter
How to use Firebase Data Connect For Flutter
Daiki Mogmet Ito
 
5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides
DanBrown980551
 
GraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracyGraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracy
Tomaz Bratanic
 
AI 101: An Introduction to the Basics and Impact of Artificial Intelligence
AI 101: An Introduction to the Basics and Impact of Artificial IntelligenceAI 101: An Introduction to the Basics and Impact of Artificial Intelligence
AI 101: An Introduction to the Basics and Impact of Artificial Intelligence
IndexBug
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
shyamraj55
 
UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6
DianaGray10
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
akankshawande
 
Ocean lotus Threat actors project by John Sitima 2024 (1).pptx
Ocean lotus Threat actors project by John Sitima 2024 (1).pptxOcean lotus Threat actors project by John Sitima 2024 (1).pptx
Ocean lotus Threat actors project by John Sitima 2024 (1).pptx
SitimaJohn
 
Presentation of the OECD Artificial Intelligence Review of Germany
Presentation of the OECD Artificial Intelligence Review of GermanyPresentation of the OECD Artificial Intelligence Review of Germany
Presentation of the OECD Artificial Intelligence Review of Germany
innovationoecd
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Speck&Tech
 
Webinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data WarehouseWebinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data Warehouse
Federico Razzoli
 
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Jeffrey Haguewood
 
WeTestAthens: Postman's AI & Automation Techniques
WeTestAthens: Postman's AI & Automation TechniquesWeTestAthens: Postman's AI & Automation Techniques
WeTestAthens: Postman's AI & Automation Techniques
Postman
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
Tatiana Kojar
 
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAUHCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
panagenda
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc
 
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing InstancesEnergy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Alpen-Adria-Universität
 
Serial Arm Control in Real Time Presentation
Serial Arm Control in Real Time PresentationSerial Arm Control in Real Time Presentation
Serial Arm Control in Real Time Presentation
tolgahangng
 
OpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - AuthorizationOpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - Authorization
David Brossard
 

Recently uploaded (20)

Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)
 
How to use Firebase Data Connect For Flutter
How to use Firebase Data Connect For FlutterHow to use Firebase Data Connect For Flutter
How to use Firebase Data Connect For Flutter
 
5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides
 
GraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracyGraphRAG for Life Science to increase LLM accuracy
GraphRAG for Life Science to increase LLM accuracy
 
AI 101: An Introduction to the Basics and Impact of Artificial Intelligence
AI 101: An Introduction to the Basics and Impact of Artificial IntelligenceAI 101: An Introduction to the Basics and Impact of Artificial Intelligence
AI 101: An Introduction to the Basics and Impact of Artificial Intelligence
 
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with SlackLet's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
Let's Integrate MuleSoft RPA, COMPOSER, APM with AWS IDP along with Slack
 
UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6UiPath Test Automation using UiPath Test Suite series, part 6
UiPath Test Automation using UiPath Test Suite series, part 6
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
 
Ocean lotus Threat actors project by John Sitima 2024 (1).pptx
Ocean lotus Threat actors project by John Sitima 2024 (1).pptxOcean lotus Threat actors project by John Sitima 2024 (1).pptx
Ocean lotus Threat actors project by John Sitima 2024 (1).pptx
 
Presentation of the OECD Artificial Intelligence Review of Germany
Presentation of the OECD Artificial Intelligence Review of GermanyPresentation of the OECD Artificial Intelligence Review of Germany
Presentation of the OECD Artificial Intelligence Review of Germany
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
 
Webinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data WarehouseWebinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data Warehouse
 
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
 
WeTestAthens: Postman's AI & Automation Techniques
WeTestAthens: Postman's AI & Automation TechniquesWeTestAthens: Postman's AI & Automation Techniques
WeTestAthens: Postman's AI & Automation Techniques
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
 
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAUHCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
HCL Notes und Domino Lizenzkostenreduzierung in der Welt von DLAU
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
 
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing InstancesEnergy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
 
Serial Arm Control in Real Time Presentation
Serial Arm Control in Real Time PresentationSerial Arm Control in Real Time Presentation
Serial Arm Control in Real Time Presentation
 
OpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - AuthorizationOpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - Authorization
 

Mobile gotcha

  • 2. Culture Product & Design Development Background Our Choices Server Client
  • 3. Cult of Simple • Fast – App Launch – Screen to Screen Switch • Easy – Tap Count • Reliable – Don’t Crash – Repeatable
  • 4. Product & Design It impacts engineering
  • 5. Websites vs. Applications Content Focus Flow & Action Focus Long Form Layout Lists/Details Responsive Design Good for websites; Not for applications
  • 6. Interaction vs. Visual • Design a house floor plan • Focus on Rooms and Hallways • Stay away from Paint, Furniture Carpet • Has & Does for each screen • Black & White then Color
  • 7.
  • 8. Adjust App Platforms • On Screen vs. Hardware Back • Up vs. Back / Stacks vs. Pages • Pull to Refresh vs. Button Refresh • Settings Room Location • Visual Design
  • 9.
  • 10. Development Background Approach to Engineering
  • 11. HTML5 vs Native • What is the skillset of the team? • What is your front door? • Which platforms are you targeting? • Phone Gap vs Titanium vs XXX
  • 12. Libs vs. Frameworks Frameworks call App call libraries your app (Few) (Lots)
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 20. Process Systems Single process/thread per request Block while waiting for I/O to complete Use Process/Thread Pools
  • 21. Evented Systems Single Process for large number of requests Non Blocking for I/O Use 1 Process per Core on system for scale
  • 22. Evented For Mobile Process Systems great for high compute Evented Systems great for I/O bound With mobile client rendering, evented systems best for front end
  • 24.
  • 26.
  • 27. Mobile Server • Scaling Node • Node Modules • Logging vs Tracking vs Metrics • File Structure / Code Size • Client / Server Line Format • Server / Server Line Format • Latency vs Bandwidth • Gotchas
  • 28. Scaling • Load Balancer talking to each node instance running on separate cores • In Node .8, finally have master/child file handle sharing based evented model • 150 qps per core per instance • 60 MB of RAM for an instance
  • 29. Node Modules • Step to Async • Express/Connect -- Framework • Vows to Mocha • Request • Underscore
  • 30. Logging/Monitoring/Tracking • Logging used for sending lots of text information – useful for debugging • Monitoring is for sending counters for realtime monitoring: Product and System – Typical: Query Rate, Response Code, Time for request, Page Views, Actions – Cube from Square • Tracking is for product metric queries – Get into a database for queries – Needed for doing Uniqing and Pathing queries
  • 31. File Structure / Code Size • Follow simple Rails/Django dir – Controllers, Helpers, Formatters, Templates – No Views, No Models • Code Size ~ 10K
  • 32. Client / Server Line Level • Single Request per screen • JSON is template based • Updateable on Server • Don’t add: – Links – Styles – Positioning • Node is part of the client NOT the server
  • 33. Server / Server Line Level Format • Stream Data – Metrics, Logging, Events, etc – Kafka, Thrift, Avro, Protocol Buffers etc. • Request/Response Data – HTTP/JSON – REST Endpoints for actual data models – Not much faster for performance
  • 34. Latency vs. Bandwidth • Latency is the issue with mobile not bandwidth • Establish and keep the socket open for ping • Use a ping and pull model not a true push • Easier to scale ping/pull model
  • 35. Node Gotchas • Exception Handling • Don’t listen on startup till you are connected to down stream services • Okay to die and respawn • httpClient.agent = false • Turn on console in production • NO BLOCKING!
  • 36. Client Native for Infinite Scroll Native for Window Manger HTML5 for everything else
  • 37. iOS / Android Native
  • 38. Native Gotchas Web to Native Messaging Cache/Image Management Tools / Test
  • 39. Web to Native Messaging • iFrame with URL for Ping • Native Pulls from Queue • Web-Sockets suck • REST for Native Services
  • 40. Cache/Image Management • Store all data in url/result hash • Render data from Hash • Render again from server response • Image src should be set to small image when off screen
  • 41. Tools/Test • iWebInspector / Weinre • Charles Proxy for req debugging • Pain when OS upgrade • Selenium with Safari Simulator (Web Parts) • Instruments UIAutomation / Robotium (Native) • Layout Test: DumpRender + ImageDiff (5%) • Vcr.js – Fixture Creater • Android Emulator Super Slow to have to do on build machine with catchup
  • 43. Screen vs Page • App is multiple Screens in one page • Page is a browser Page and has an implication of JS Load/Parse time • Screen to Screen move is div show/hide
  • 44. Backbone.js • Controls Routing from Screen to Screen • Controls Screen lifecycle (load, show, hide) • Controls View Updating based on Model Change • Has Model construct for Validation • BaseRouter to Backbone – Transitions, screen life cycle • M V C links in Backbone lead to mem leaks
  • 45. Libraries • Zepto – Manipulate the DOM • iScroll – Inertial Scrolling on iOS – Does not work on Android – Pull to Refresh • Underscore – Collection helpers and binding constructs, templating
  • 46. Build / Packaging • Closure – Minify, Comment Removal, Template Compilation • SASS – Variables, Functions, Selector Inheritance • Bundle (set of screens) – Local, Template, Controllers/Views • Build independently and resuable
  • 47. Startup • Initial – Index.html – List of bundle files – Store all in Local Storage – Backbone starts home bundle • Upgrade – Index.html – MD5 has for each file – Compare/Download Diff – Store in Local Storage
  • 48. Tools / Gotchas • Chrome Memory Profiler – https://developers.google.com/chrome- developer-tools/docs/heap-profiling • Memory Leak Tracking – http://gent.ilcore.com/2011/08/finding-memory- leaks.html • Hardware Acceleration for DIV render only on screen DIV’s • Double Render from Cache