Creating an Effective Mobile API

2,755 views
2,578 views

Published on

Your visitors interact with content, not with your website. Content consistency is crucial to a successful user experience. Re-publishing is one option but it’s an inside-out action that relies on the authority controlling where the information goes. An API frees your data and the responsibility to where it is published and accessed. Mobile is a major consumer for your API but not every API is setup to handle the mass of requests coming from those devices. Learn how to mobile devices consume API’s with limited or low bandwidth and how to to tailor your API to be as efficient and effective as possible.

http://environmentsforhumans.com/2012/doteduguru-summit/

Published in: Technology
0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,755
On SlideShare
0
From Embeds
0
Number of Embeds
44
Actions
Shares
0
Downloads
27
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

Creating an Effective Mobile API

  1. 1. Creating API’s for Mobile Nick DeNardis
  2. 2. @nickdenardisAssociate Director of Web CommunicationsWayne State Universityhttp://wayne.edu/Host of EDU Checkuphttp://educheckup.com/Curator of EDU Snippitshttp://edusnippits.com/Writer for .eduGuruhttp://doteduguru.com/
  3. 3. DisclaimerThis talk is less about how to code an API butmore about the strategy behind creating aflexible and resilient API.
  4. 4. API:Application programming interface
  5. 5. Not just for robots.http://www.flickr.com/photos/stevent/3241986538/
  6. 6. The API’s job is to make the developer as successful as possiblehttp://knowyourmeme.com/memes/i-hate-sandcastles-success-kid
  7. 7. Where isn’t it useful?http://www.flickr.com/photos/daychokesnight/2149714792/
  8. 8. Too slow...http://www.flickr.com/photos/toolmantim/6170448143/
  9. 9. Too complicated...http://www.flickr.com/photos/toolmantim/6170448143/
  10. 10. Adds a layerhttp://www.flickr.com/photos/jabb/6715983809/
  11. 11. Complications with mobile “always on”
  12. 12. Mobile isn’t going anywhere 1.45 Million devices per day 371,000 births per dayhttp://www.lukew.com/ff/entry.asp?1506
  13. 13. Mobile Data Traffic Expected To Rise 40- Fold Over Next Five Yearshttp://techcrunch.com/2010/03/30/mobile-data-traffic-rise-40-fold/
  14. 14. Desktop250 kb - Avg page weight2.5 pages - Avg number per visit 1300625 kb - Bandwidth per visit 975 650Mobile 32550 kb - Avg page weight25 pages - Avg number per visit 0 Data Desktop Mobile1.25 mb - Bandwidth per visit
  15. 15. Mobile Desktop 40 30Millions of visitors 20 10 0 2009 2010 2011 2012 2013 2014 2015 2016 2017 http://wayne.edu/
  16. 16. The Mobile Web is Slow And it’s mostly our fault
  17. 17. You can’t blame the network for everything CSS Images JavascriptInitial HTMLCell Latency Time
  18. 18. Second Request ImagesNew ContentCell Latency Time
  19. 19. Do less better
  20. 20. One size != fit all https://api.twitter.com/1/ https://us2.api.mailchimp.com/1.3/ https://api.foursquare.com/v2/ https://api.instagram.com/v1/ https://www.salesforce.com/services/Soap/c/18.0 https://api.wayne.edu/v1/ Think versioning from the start
  21. 21. SOAP RESTThe request: The request:GET /StockPrice HTTP/1.1 GET /StockPrice/IBM HTTP/1.1Host: example.org Host: example.orgContent-Type: application/soap+xml; charset=utf-8 Accept: text/xmlContent-Length: nnn Accept-Charset: utf-8<?xml version="1.0"?> The response:<env:Envelope xmlns:env="http://www.w3.org/2003/05/soap-envelope" HTTP/1.1 200 OK xmlns:s="http://www.example.org/stock-service"> Content-Type: text/xml; charset=utf-8 <env:Body> Content-Length: nnn <s:GetStockQuote> <s:TickerSymbol>IBM</s:TickerSymbol> <?xml version="1.0"?> </s:GetStockQuote> <s:Quote xmlns:s="http://example.org/stock- </env:Body> service"></env:Envelope> <s:TickerSymbol>IBM</s:TickerSymbol> <s:StockPrice>45.25</s:StockPrice>The response: </s:Quote>HTTP/1.1 200 OKContent-Type: application/soap+xml; charset=utf-8Content-Length: nnn<?xml version="1.0"?><env:Envelope xmlns:env="http://www.w3.org/2003/05/soap-envelope" xmlns:s="http://www.example.org/stock-service"> <env:Body> <s:GetStockQuoteResponse> <s:StockPrice>45.25</s:StockPrice> </s:GetStockQuoteResponse> </env:Body> 4 kb vs 2 kb</env:Envelope> Round Trip
  22. 22. Stick to REST
  23. 23. http://www.flickr.com/photos/philmanker/3654636770/ XML sucks
  24. 24. Your best friend JSONEasy to encode:$arr = array(a => 1, b => 2, c => 3, d => 4, e => 5);json_encode($arr);Easy to decode:$json = {"a":1,"b":2,"c":3,"d":4,"e":5};json_decode($json);Javascript:var myObject = eval(( + json + ));
  25. 25. Existing Resourceshttp://doteduguru.com/id7800-results-higher-ed-cms-usage-survey-2011.html
  26. 26. Not everything is in the CMS WebsiteCMS Gather & Clean Mobile WebsiteEvents Shadow storage Mobile AppLDAP API Webserver Digital SignageBanner Third Party
  27. 27. Rolling your own API Trust no one.
  28. 28. Create. Read. Update. Delete.http://www.flickr.com/photos/fss/2181882493/
  29. 29. Start with a maphttp://www.flickr.com/photos/56684679@N08/6155875352/
  30. 30. Read first.http://www.flickr.com/photos/hackaday/4425372655/
  31. 31. GET /academic/colleges/listingGET /academic/colleges/infoGET /academic/majors/listingGET /academic/majors/infoGET /academic/classes/listingGET /academic/classes/infoGET /parking/availability/listingGET /parking/availability/info
  32. 32. The devil is in the details Simple URLResponse code Total countData container Keep it lightweight 91 KB
  33. 33. Use only what you need FiltersLess data 41 KB
  34. 34. Writing data
  35. 35. POST /admissions/rfi/addPOST /admissions/visit/addPOST /admissions/application/addPOST /academic/colleges/addPOST /academic/colleges/editPOST /academic/majors/addPOST /academic/majors/edit
  36. 36. Soft Delete (keep all the data!)
  37. 37. POST /academic/colleges/removePOST /academic/majors/removePOST /academic/classes/removePOST /parking/availability/remove
  38. 38. Authentication /api/user/auth
  39. 39. Cache. Cache. Cache.
  40. 40. Professional cachehttp://www.flickr.com/photos/carlos/2417032795/
  41. 41. APC<?php$bar = BAR;apc_store(foo, $bar);var_dump(apc_fetch(foo));?>
  42. 42. Ghetto cachehttp://www.flickr.com/photos/basic_sounds/5779597720/
  43. 43. Static files<?phpif ((is_file($_SERVER[SCRIPT_FILENAME]..json)) && (time()-filemtime($_SERVER[SCRIPT_FILENAME]..json) < 3600)) { readfile($_SERVER[SCRIPT_FILENAME]..json); exit; }// (the php script itself goes here)echo $response;$fp = fopen($_SERVER[SCRIPT_FILENAME]..json, w);fwrite($fp, $response);fclose($fp);?>
  44. 44. HTML5 localStorageif (typeof(localStorage) == undefined ) { alert(Your browser does not support HTML5 localStorage. Try upgrading.);} else { try { localStorage.setItem("name", "Hello World!"); //saves to the database, } catch (e) { if (e == QUOTA_EXCEEDED_ERR) { alert(Quota exceeded!); //data wasnt successfully saved due to quota exceedso throw an error } } document.write(localStorage.getItem("name")); //Hello World! localStorage.removeItem("name"); //deletes the matching item from the database}http://paperkilledrock.com/2010/05/html5-localstorage-part-one/
  45. 45. Expires header <?php header(Expires: .gmdate(D, d M Y H:i:s GMT, time() + 3600)); ?>1 Month 1 Week 1 DaySemesters Courses EventsSubjects Media Experts NewsDegreesMap Categories No CacheMap Locations Course Availability Parking Availability
  46. 46. Our StatsFeb 2011 - In production2.5 million requests48% from mobile 21% iOS 23% Android 66% Web95% GET’s16 ms average response time
  47. 47. Examples
  48. 48. Mobile news
  49. 49. maps/locations/listingGoogle API events/event/listing directory/people/listing academic/courses/listing
  50. 50. maps/category/listing events/event/listing maps/location/info
  51. 51. faculty/profile/info go/url/info
  52. 52. Hackathon Community through datahttp://www.flickr.com/photos/hackny/5684887983/
  53. 53. Resources• http://apigee.com/• http://rubyonrails.org/• http://cakephp.org/• http://37signals.com/svn/posts/3018-api-design-for-humans• http://broadcast.oreilly.com/2011/06/the-good-the-bad-the-ugly-of-rest- apis.html• http://sixrevisions.com/html/introduction-web-storage/• http://webcomm.fiu.edu/2011/11/json-as-an-api-tool-and-why-its-awesome/• http://doteduguru.com/id4579-results-higher-ed-cms-usage.html
  54. 54. Hackathons• http://dschool.stanford.edu/blog/2012/01/27/hack-d-kicks-off-more-than-a- dozen-projects-underway/• http://civic.mit.edu/blog/schock/occupydata-hackathon-2-roundup• http://newmed.media.mit.edu/health-and-wellness-innovation-2012• http://nyuad.nyu.edu/hackathon/about/• http://startup.berkeley.edu/hackathon/• http://www.njit.edu/hackathon/• http://www.lib.umich.edu/art-architecture-engineering-library/ announcements/48-hour-mobile-app-hackathon
  55. 55. Questions? Don’t be shy.
  56. 56. Thank You @nickdenardisnick.denardis@gmail.com http://nickdenardis.com/

×