From 27c59afa9f92e822369c756ed822c80c696b520e Mon Sep 17 00:00:00 2001 From: Christopher Chedeau Date: Mon, 23 Feb 2015 19:36:23 -0800 Subject: [PATCH] Update Image.md --- docs/Image.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/docs/Image.md b/docs/Image.md index 0b1ccf202..55b10bb40 100644 --- a/docs/Image.md +++ b/docs/Image.md @@ -47,3 +47,14 @@ When your entire codebase respects this convention, you're able to do interestin iOS saves multiple sizes for the same image in your Camera Roll, it is very important to pick the one that's as close as possible for performance reasons. You wouldn't want to use the full quality 3264x2448 image as source when displaying a 200x200 thumbnail. If there's an exact match, React Native will pick it, otherwise it's going to use the first one that's at least 50% bigger in order to avoid blur when resizing from a close size. All of this is done by default so you don't have to worry about writing the tedious (and error prone) code to do it yourself. +## Source being an object + +In React Native, one interesting decision is that the `src` attribute is named `source` and doesn't take a string but an object with an `uri` attribute. + +```javascript + +``` + +On the infrastructure side, the reason is that it allows to attach metadata to this object. For example if you are using `ix`, then we add a `isStored` attribute to flag it as a local file (don't rely on this fact, it's likely to change in the future!). This is also future proofing, for example we may want to support sprites at some point, instead of outputting `{uri: ...}`, we can output `{uri: ..., crop: {left: 10, top: 50, width: 20, height: 40}}` and transparently support spriting on all the existing call sites. + +On the user side, this lets you annotate the object with useful attributes such as the dimension of the image in order to compute the size it's going to be displayed in. Feel free to use it as your data structure to store more information about your image.