WorryFree Computers   »   [go: up one dir, main page]


David East
David East
Developer Advocate

The UIViewController comes with a lifecycle that informs us when important events occur. Events such as viewDidLoad,viewWillAppear, viewDidDisappear, and the always fun "Stop! You're using too much memory!" warning.
The UIViewController's lifecycle is a huge convenience. But it can be confusing to know when to do what. This article will cover a few best practices to help you develop with confidence.
Since we're developers, we'll use a zero-based index for this list.

0. Initialize references in viewDidLoad

override func viewDidLoad() {
  super.viewDidLoad()
  ref = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com")
}
- (void)viewDidLoad {
  [super viewDidLoad];
  self.ref = [[Firebase alloc] initWithUrl:@"https://<YOUR-FIREBASE-APP>.firebaseio.com"];
}
You can't count on a UIViewController's initializer. This is because controllers that come from the Storyboard don't have their initializer called. This leaves us with the viewDidLoad method.
The viewDidLoad method is usually the first method we care about in the UIViewController lifecycle. Since viewDidLoad is called once and only once in the lifecycle, it's a great place for initialization.
The viewDidLoad method is also called whether you use Storyboards or not. Outlets and properties are set at this point as well. This will enable you to do any dynamic creation of a reference's location.

1. Initialize references with implicitly unwrapped optionals (Swift-only)

class ViewController : UIViewController {
  var ref: Firebase!

  override func viewDidLoad() {
    super.viewDidLoad()
    ref = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com")
  }
}
In Swift all properties' values must be set before initialization is complete. And that's a big problem. You can't rely on a UIViewController's initializer to ever be called. So how do you set the value for the Firebase reference property? Use an implicitly unwrapped optional.
By unwrapping the property the compiler will assume the value will exist by the time it's called. If the value is nil when called, it'll crash the app. That won't happen for a reference property if the value is set in viewDidLoad.
Using an implicitly unwrapped optional is you telling the compiler: "Chill-out, I know what I'm doing."
You might be wondering why you shouldn't inline the value.
class ViewController : UIViewController {
  let ref = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com")
}
There's no problem using an inline value. You're just limited to static values since you can't use other properties or variables.
class ViewController : UIViewController {
  // This won't compile :(
  let ref = Firebase(url: "https://my.firebaseio.com/\(myCoolProperty)")
}

2. Create listeners in viewWillAppear, not in viewDidLoad

override func viewWillAppear(animated: Bool) {
  super.viewWillAppear(animated)
  ref.observeEventType(.Value) { (snap: FDataSnapshot!) in print (snap.value) }
}
- (void)viewWillAppear:(BOOL)animated {
  [super viewWillAppear:animated];
  [self.ref observeEventType:FEventTypeValue withBlock:^(FDataSnapshot *snapshot) {
    NSLog(@"%@", snapshot.value);
  }];
}
Your app should be a good citizen of battery life and memory. To preserve battery life and memory usage, you should only synchronize data when the view is visible.
The viewWillAppear method is called each time the view becomes visible. This means if you set your listener here, your data will always be in sync when the view is visible.
You should avoid creating listeners in viewDidLoad. Remember that viewDidLoad only gets called once. When the view disappears you should remove the listener. This means the data won't re-sync when the view becomes visible again.

3. Remove listeners in viewDidDisappear with a FirebaseHandle

class ViewController : UIViewController {
  var ref: Firebase!
  var handle: UInt!

  override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated)
    handle = ref.observeEventType(.Value) { (snap: FDataSnapshot) in print (snap.value) }
  }
}
@interface ViewController()
@property (nonatomic, strong) Firebase *ref;
@property FirebaseHandle handle;
@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];
  self.ref = [[Firebase alloc] initWithUrl:@"https://<YOUR-FIREBASE-APP>.firebaseio.com"];
}

- (void)viewWillAppear:(BOOL)animated {
  [super viewWillAppear:animated];
  self.handle = [self.ref observeEventType:FEventTypeValue withBlock:^(FDataSnapshot *snapshot) {
    NSLog(@"%@", snapshot.value);
  }];
}

@end
To remove a listener in iOS you need a FirebaseHandle. A FirebaseHandle is just a typealias for a UInt that keeps track of a Firebase listener.
Note that in Swift you need to use an implicitly unwrapped optional since the value can't be set in the initializer. The handle's value is set from the return value of the listener.
Use this handle to remove the listener in viewDidDisappear.
override func viewDidDisappear(animated: Bool) {
  super.viewDidDisappear(animated)
  ref.removeObserverWithHandle(handle)
}
-(void)viewDidDisappear:(BOOL)animated {
  [super viewDidDisappear:animated];
  [self.ref removeObserverWithHandle:self.handle];
}
If your controller is still syncing data when the view has disappeared, you are wasting bandwidth and memory.

Leaky Listeners

A leaky listener is a listener that is consuming memory to store data that isn't displayed or accessed. This is especially an issue when navigating using a UINavigationController, since the root controller isn’t removed from memory when navigating to a detail controller. This means a root controller will continue to synchronize data if the listener isn't removed when navigating away. This action takes up needless bandwidth and memory.


The thought of removing the listener might sound unappealing. You may think you need to keep your listener open to avoid downloading the same data again, but this is unnecessary.
Firebase SDKs come baked in with caching and offline data persistence. These features keep the client from having to fetch recently downloaded data.


4. Enable offline in the AppDelegate's initializer

class AppDelegate: UIResponder, UIApplicationDelegate {
  var window: UIWindow?

  override init() {
    Firebase.defaultConfig().persistenceEnabled = true
  }
}
@implementation AppDelegate

- (instancetype)init
{
  self = [super init];
  if (self) {
    [[Firebase defaultConfig] setPersistenceEnabled:YES];
  }
  return self;
}

@end

Speaking of offline, this tip isn't UIViewController specific, but it's important. Offline has to be set before any other piece of Firebase code runs.
Your first instinct might be to enable offline in the AppDelegate's application:didFinishLaunchingWithOptions method. This will work for most situations, but not for all. This can go wrong when you inline a Firebase property's value in the root UIViewController. The value of the Firebase property is set before application:didFinishLaunchingWithOptions gets called, which will cause the SDK to throw an exception.
By setting up the offline config in the AppDelegate init we can avoid this issue.

Final example


Check out this gist to see the final version of the UIViewController.


Takeaways

If you remember anything remember these things:
  • Initialize references in viewDidLoad
  • Synchronize data only when the view is visible
  • Store a handle to simplify removing a reference
  • Remove listeners when the view in not visible
  • Configure offline persistence in the AppDelegate's initializer
How do you manage Firebase in your UIViewController? Let us know if you're using any of these today or if you have any best practices of your own.

Tamal Saha
Tamal Saha
Engineer

We have two big feature announcements: Google Login, and an entirely new version of the Firebase command-line interface.

Google Login

Many of you have asked for more security on your Firebase account. Starting today, Google Login is the default authentication for firebase.com. If you have an existing Firebase account you'll have the option of migrating to Google Login when you log in to your Firebase account. If you don't have a Firebase account yet, you'll be prompted to create one with Google Login.

This means you'll have access to new security features, like two-factor authentication and Google account recovery. As we work on integrating with more Google services, Google Login will ensure you get access to new features.

CLI 2.0.0

In May of 2014, we introduced Firebase Hosting - production-grade hosting for developers. With our CLI, developers could deploy static content with one command: firebase deploy. Since releasing the CLI, we've received a lot of feedback from our developer community and with today’s 2.0.0 CLI release, we're excited to add several new features. We'll outline the highlights below, and you can dive into the docs for all the details.

Start a local server

You can now start a static web server for your Firebase content by running the command:

firebase serve

This local server will respect all of your app's configuration rules defined in firebase.json.

Read and write data

With today's release, you can read and write data from your Firebase database directly from the CLI. The new data:get command lets you specify a file to output the resulting JSON, or logs it to the command line. Similarly, with data:set you can import a JSON file to your Firebase database or write data directly from the CLI. Let's say we have the following new-users.json file that we'd like to import to our Firebase database at the top-level /users path:

{
    "alanisawesome": {
      "date_of_birth": "June 23, 1912",
      "full_name": "Alan Turing"
    },
    "gracehop": {
      "date_of_birth": "December 9, 1906",
      "full_name": "Grace Hopper"
    }
}

To write this to our database from the command line, we can now run:

firebase data:set /users new-users.json

In addition to reading and writing data, you can also run the commands data:update, data:push, and data:remove. See the documentation for details.

Run commands programmatically

All CLI commands can now be run programmatically by requiring the firebase-tools module via Node.js. Commands can also be run with a flag to output JSON. For instance, if you want to retrieve a list of the Firebases for your account:

var client = require('firebase-tools');
client.list().then(function(result) {
  console.log(result);
});

These are just a few of the new features that shipped with CLI 2.0.0. Check out the docs for the full details.

Get Started

We've been working hard on these new features and we're excited for you to try them out! To enable Google Login, log in to your Firebase account and follow the steps outlined in your account dashboard.

To install the latest version of firebase-tools, run:

npm install -g firebase-tools

Check out the documentation for a full list of new CLI features, and let us know what you think by submitting a GitHub issue or pull request.

Happy coding!

Michael Bleigh
Michael Bleigh
Engineer

Today we're excited to announce that front-end web hosting service Divshot has joined Firebase!

Both teams share a passion for creating fantastic developer experiences, and now we're moving forward together toward that common goal. Divshot and Firebase have teamed up before: Firebase sponsored Divshot's Static Showdown hackathon and was used by more than 50 percent of the developers who participated.

As a cofounder of Divshot, I'm excited to bring the best parts of Divshot's technology to Firebase Hosting. We're launching a brand new Firebase command-line interface today with a local static web server powered by Divshot's open-source Superstatic library. Now you can develop locally with all of your rewrites, redirects, and other Firebase Hosting options. There's more on the way, so stay tuned!

Moving forward the team will be fully focused on making Firebase Hosting a fantastic developer experience, so Divshot will shut down existing products and services on Monday, December 14, 2015. For existing Divshot customers, we have a detailed migration guide to help you easily transition to Firebase Hosting. The transition should be quick and painless (especially because many of you are already Firebase developers!).

I want to thank every Divshot user for their support over the past three years. I’ve been blown away by your creativity and community spirit, and I can't wait to see what you all build next.

Happy coding!

David East
David East
Developer Advocate

Fan-out is a great strategy when it comes to Firebase. Fan-out itself is the process duplicating data in the database. When data is duplicated it eliminates slow joins and increases read performance.

Not all is perfect with fan-out though. The difficult part of fan-out is keeping each duplicated piece up to date.

The latest release of the Firebase SDKs included multi-path updates. This introduced a technique called client-side fan-out.

With client-side fan-out, fanned-out databases can be both performant and consistent.

Client-side fan-out

Multi-path updates allow the client to update several locations with one object. We call this client-side fan-out, because data is "fanned" across several locations. This proven fan-out technique is used by the giants of social messaging.

The fan-out object is the single object that "fans" out the data. To create a fan-out object, specify the deep path as the key of the object.

var updatedUser = { name: 'Shannon', username: 'shannonrules' };
var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com");
var fanoutObject = {};

fanoutObject['/users/1'] = updatedUser;
fanoutObject['/usersWhoAreCool/1'] = updatedUser;
fanoutObject['/usersToGiveFreeStuffTo/1'] = updatedUser;

ref.update(fanoutObject); // atomic updating goodness
let updatedUser = ["name": "Shannon", "username": "shannonrules"]
let ref = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com")

let fanoutObject = ["/users/1": updatedUser, "/usersWhoAreCool/1": updatedUser, "/usersToGiveFreeStuffTo/1", updatedUser]

ref.updateChildValues(updatedUser) // atomic updating goodness
Map updatedUser = new HashMap();
newPost.put("name", "Shannon");
newPost.put("username": "shannonrules");

Firebase ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/");

Map fanoutObject = new HashMap();
fanoutObject.put("/users/1", updatedUser);
fanoutObject.put("/usersWhoAreCool/1", updatedUser);
fanoutObject.put("/usersToGiveFreeStuffTo/1", updatedUser);

ref.updateChildren(fanoutObject); // atomic updating goodness

Then save the object to a top-level location and the updates will be applied to every specific child. In this example we save the fanout object to the root.

The key concept is that this is an atomic operation. Since the update involves only one object the operation will either succeed or fail. This means there's no incomplete states to deal with.

Client-side fan-out can help keep fanned-out data structures consistent.

Consistency in fanned-out structures

Let's say you're a big time social network. A fanned-out data structure is a great use case due to the large amount of users, posts, followers, and timelines. A user has a list of followers. Whenever a user makes a post it shows up in their follower's timelines. In a large data scenario, a query of all posts would be too slow to get a single user's timeline. The faster option is duplication.

A flat structure represents each user's timeline as a data structure.

{
  "timeline": {
    "user2": {
      "-K-zOrtjiCGe7tgRk8DG": {
        "text": "I love emojis!",
        "uid": "user1"
      }
    },
    "user3": {
      "-K-zOrtjiCGe7tgRk8DG": {
        "text": "I love emojis!",
        "uid": "user1"
      }
    }
  },
  "followers": {
    "user1": {
      "user2": true,
      "user3": true
    }
  }
}

This structure duplicates the post to each timeline. Both user2 and user3 are following user1. When user1 sends a post, it's written to each follower's timeline. With this structure any given user's timeline is returned with a single read.

var postsRef = new Firebase('https://<YOUR-FIREBASE-APP>.firebaseio.com/posts/user1');
postsRef.on('value', (snap) => console.log(snap.val()));
let postsRef = Firebase(url: 'https://<YOUR-FIREBASE-APP>.firebaseio.com/posts/user1')
postsRef.observeEventType(.Value) { print($0) }
Firebase postsRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/posts/user1");
postsRef.addValueEventListener(new ValueEventListener() {
    @Override
    public void onDataChange(DataSnapshot snapshot) {
        System.out.println(snapshot.getValue());
    }
    @Override
    public void onCancelled(FirebaseError firebaseError) {
        System.out.println("The read failed: " + firebaseError.getMessage());
    }
});

You've finally decided to include the highly-requested edit feature for posts. Updating a single post is not a simple process with a fanned-out structure. Each follower must receive the update. Before client-side fan-out the code was problematic. Below is what we had to do before client-side fan-out. For your safety, please don't copy and paste this code.

var postsRef = new Firebase('https://<YOUR-FIREBASE-APP>.firebaseio.com/posts');
var queryRef = postsRef.orderByChild('uid').equalTo('user1');
queryRef.on('value', (snap) => snap.forEach((subSnap) => subSnap.ref().update({ title: 'New title' })));
let postsRef = Firebase(url: 'https://<YOUR-FIREBASE-APP>.firebaseio.com/posts')
let queryRef = postsRef.queryOrderedByChild("uid").queryEqualToValue("user1")
queryRef.observeEventType(.Value) { snapshot in
    for child in snapshot.children {
      let childSnap: FDataSnapshot = child as! FDataSnapshot
      childSnap.ref.updateChildValues([ "title": "New title"])
    }
})
Firebase postsRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/posts");
Query queryRef = ref.orderByChild("height").equalTo("user1");
queryRef.addValueEventListener(new ValueEventListener() {
    @Override
    public void onDataChange(DataSnapshot snapshot) {
        System.out.println(snapshot.getValue());
        for (DataSnapshot childSnap : snapshot.getChildren()) {
            Map updatedPost = new HashMap();
            updatedPost.put("title", "New title");
            childSnap.getRef().updateChildren();
        }
    }

    @Override
    public void onCancelled(FirebaseError firebaseError) {
        System.out.println("The read failed: " + firebaseError.getMessage());
    }
});

The problem with this approach is that this duplication process can fail if there's a lost connection. This failure leaves the data in an incomplete state that can only be fixed by a complicated rollback.

This is the type of problem solved by client-side fan-out.

Fanning out the data

Rather than execute multiple writes to the Firebase database, let's create one fan-out object to send.

To write to every timeline we need know the user’s uid and their followers. In this example, we pass the user’s uid, an array of the user’s followers, and the post as parameters.

function fanoutPost({ uid, followersSnaphot, post }) {
  // Turn the hash of followers to an array of each id as the string
  var followers = Object.keys(followersSnaphot.val());
  var fanoutObj = {};
  // write to each follower's timeline
  followers.forEach((key) => fanoutObj['/timeline/' + key + '/' + postId] = post);
  return fanoutObj;  
}
func fanoutPost(uid: String, followersSnaphot: FDataSnapshot, post: [String, AnyObject]) -> [String, AnyObject] {
  let followersData = followersSnaphot as! [String: AnyObject]
  let followers = followersData.keys.array
  var fanoutObj = [String, AnyObject]
  // write to each follower's timeline
  followers.forEach { fanoutObject["/timeline/\(key)"] = post }
  return fanoutObj
}
public Map fanoutPost(String uid, DataSnapshot followersSnaphot, Map post) {
  Map fanoutObject = new HashMap<>();
  for (DataSnapshot follower: followersSnaphot.getChildren()) {
      fanoutObject.put( "/timeline/" + follower.getKey(), post);
  }
  return fanoutObject;
}

To get the followers, create a listener at the /followers/$uid location. Whether you're dealing with an Activity, UIViewController, or web page you need to synchronize the followers on load.

(function() {
  var followersRef = new Firebase('https://<YOUR-FIREBASE-APP>.firebaseio.com/followers');
  var followers = {};
  followersRef.on('value', (snap) => followers = snap.val());
}());
class MyViewController : UIViewController {

  var followersRef: Firebase!
  var followersSnap: FDataSnapshot!

  override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated);
    followersRef = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com/followers")
    followersRef.observeEventType(.Value) { self.followersSnap = $0 }
  }

}
public class MainActivity extends AppCompatActivity {

  Firebase mFollowersRef;
  Map mFollowers;

  @Override
  public void onStart() {
    super.onStart();
    mFollowersRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/followers");
    mFollowersRef.addValueEventListener(new ValueEventListener() {
      @Override
      public void onDataChange(DataSnapshot dataSnapshot) {
        mFollowers = (Map) dataSnapshot.getValue();
      }

      @Override
      public void onCancelled(FirebaseError firebaseError) {

      }
    })
  }
}

When the user sends their post, loop through the follower's keys and create the fan-out object. The key is the timeline location with the follower's key as the child.

(function() {
  var followersRef = new Firebase('https://<YOUR-FIREBASE-APP>.firebaseio.com/followers');
  var followers = {};
  followersRef.on('value', (snap) => followers = snap.val());
  var btnAddPost = document.getElementById('btnAddPost');
  var txtPostTitle = document.getElementById('txtPostTitle');
  btnAddPost.addEventListener(() => {
    // make post
    var post = { title: txtPostTitle.value };
    // make fanout-object
    var fanoutObj = fanoutPost({ uid: followersRef.getAuth().uid, followers: followers, post: post });
    // Send the object to the Firebase db for fan-out
    rootRef.update(fanoutObj);
  });

  // ... fanoutPost method would be below
}());
class MyViewController : UIViewController {

  @IBOutlet var titleTextField: UITextField;

  var followersRef: Firebase!
  var followersSnap: FDataSnapshot!

  override func viewWillAppear(animated: Bool) {
    super.viewWillAppear(animated);
    followersRef = Firebase(url: "https://<YOUR-FIREBASE-APP>.firebaseio.com/followers")
    followersRef.observeEventType(.Value) { self.followersSnap = $0 }
  }

  @IBAction func addPostDidTouch(sender: UIButton) {
    // Make a post
    var post = ["title", titleTextField.text]
    // Make fan-out object
    fanoutPost(followersList.uid, followers: followersSnap, post: post)
  }

  // ... fanoutPost method would be below

}
public class MainActivity extends AppCompatActivity {

  Firebase mFollowersRef;
  Map mFollowers;

  @Override
  public void onStart() {
    super.onStart();
    mFollowersRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/followers");
    mFollowersRef.addValueEventListener(new ValueEventListener() {
      @Override
      public void onDataChange(DataSnapshot dataSnapshot) {
        mFollowers = (Map) dataSnapshot.getValue();
      }

      @Override
      public void onCancelled(FirebaseError firebaseError) {

      }
    })

    // Add click handler
    Button mPostButton = (Button) findViewById(R.id.postButton);
    TextView mPostTitle = (TextView) findViewById(R.id.postTitle);

    mPostButton.setOnClickListener(new View.OnClickListener() {
       public void onClick(View v) {
         Map post = new HashMap();
         post.put("title", mPostTitle.getText());
         fanoutPost(mFollowersRef.getAuth(), mFollowers, post);
       }
    });
  }
  // ... fanoutPost method would be below
}

And just like that we have a performant, atomic, and consistent data structure.

Takeaways

If you remember anything from this article, remember these three things:

  • Fan-out is for big data solutions (tens of thousands to millions of records).
  • Duplicate your data to lead to fast single reads.
  • Keep the duplicate data consistent with a client-side fan-out.

How do you structure your data? Let us know if you've included the new mutli-path update feature.