QConSF 2012: Mobile Web Tooling

Pete LePage (@petele) gives a great overview of all the different tools you should consider when embarking on mobile web application development.

Sublime – text editor for Mac

  • Minify, compiles
  • live browser reloads
  • JSHint, JSLint
  • Watches all files in direcotry for reloads

Great sites for good design patterns for mobile dev:

Great HCI guidelines from Android, iOS, Safari, etc. can be found on their respective websites

Start with boilerplates from SenchaTouch, bootstrap, and maybe even jqueryMobile

github.com/ftlabs/fastclick for improving perfomance of button clicks (usually delayed by 300ms for pinch zoom, slide, etc.)

To debug, jsconsole.com can be used for remote debugging on other devices and will show stuff on site….coolio.

Hammer.js is cool for jestures to listen to those events

brian.io/lawnchair good to store some transient data by abstracting away for IndexDB, WebSQL or LocalStorage

@media, cool for high density resolution or using CSS -webkit-image-set for both 1x and 2x image densities for hi-rez icons

CharlesProxy good to test network latency or Network Link Conditioner on Mac

Chrome Dev Tools have cool features to override geolocation, user agent, and device orientation

Android and Safari remote debugging possible but need USB cable to connect.

m.chromeexperiments.com to show off your skills.

new.mcrbug.com for filing any bugs

User Experience is x-axis and Platforms is y when trying to decide whether to go native or not, lower-right native, upper-left is hybrid. Left of line is better for hybrid because of hardware acceleration and browser improvements.

PhoneGap Perf Tips:
  1. Keep small footprint by limiting libs
  2. Use touch events, not click events
  3. Use hardware accelerated CSS transitions
  4. Avoid network access and cache locally.

zepto.js is a lightweight version of jquery that doesn’t worry about legacy browsers

Phonegap API explorer is a reference application to look at from the AppStore
Checkout PhoneGap Build to target up to 6 platforms without having to load XCode, Eclipse, etc to build all the individual platforms by hand.

QConSF 2012: Real Time MVC with Geddy

Daniel Erickson from yammer presents on mixing MVC with Real Time apps.

MVC is here to say because…

  • It provides structure to a project
  • Allow people to easily jump into a project and multiple people at that
  • Easier to get started with

Realtime is great for:

  • Getting instant feedback from your users
  • Works well on mobile (Voxer)
  • WebSockets over long/short polling

How can MVC and Real Time can be mixed?

Enter Geddy…if you know Rails, NoSQL/SQL ORM layers and templating languages than Geddy is a natural progression. PostGres, Riak, MongoDB adapters; EJS and Jade TL’s. Supports RT OOTB.

Geddy gives you a reach ORM/MVC framework that you can readily work into your Node.js applications.  I’ll have to take a look when I get back!

QConSF 2012: Graph Database Overview from Emil Eifrem

@emileifrem gives a great introduction on NoSQL databases, especially graph databases.  He also gives a quick overview on use cases for graph databases and highlights some of the benefits of using Neo4j in this endeavor.  Here are my notes from this session:

Trends in BigData & NoSQL:

  • Increasing data size
  • Increasing connected data
  • Semi-structured data
  • Architecture – a facade over multiple services

Categories of NoSQL

Key/Value store (heritage from Amazon Dynamo) –

  • Riak, Redis, and Voldermort are implementation examples
  • Strengths is that it’s a simple but also weakness

Columnar Stores

  • BigTable – every row can potentially have it’s
  • Examples are HBase and Cassandra, Hyper Table
  • Supports semi-structured data but weakness is nested or connections

Document Database

  • Collections of documents, JSON that could potentially be nested
  • 90% uptick on NoSQL in MongoDB but also CouchDB
  • Strength is simplicity of database, but hard to do connected data

Graph Database

  • Nodes and Relationships
  • Examples are Neo4j, InfiniteDB, OrientDB, etc.
  • Great for connectiveness of data and complexity but harder to scale to size

Graph databases can provide statistical data on how likely a node is related to other nodes.  Relationships are first class citizens in graph databases to give color to how nodes are related.  Nodes and relationships have simple key/value pair types.  Indexes are also available.  Types are being considered for post production control of data.

Speed comparison for social graph database example from presentation shows that MySQL is 2000ms and Neo4j is 2ms.  For 2k to 1mil people if they’re connected is still 2ms.  In SQL, JOIN clause explosion due to combinatorial issue.  Neo4j can visit about 1-2mil nodes/per second.

Graph queries:

Cypher gives you higher abstraction and ease of use, but slower performance. It uses graph patterns to defines nodes and relationships represented like:

START A=node:person(name=”A”)

MATCH (A) – [:LOVES] -> (B)

RETURN B as lover

pattern-matching query language, declarative grammer and aggregation, ordering, limits…tabular results

Neo4j is fully ACID compliant as opposed to eventual consistency like most other NoSQL systems