Commit Graph

89 Commits

Author SHA1 Message Date
Héctor Ramos 1151c096da Update copyright headers to yearless format
Summary: This change drops the year from the copyright headers and the LICENSE file.

Reviewed By: yungsters

Differential Revision: D9727774

fbshipit-source-id: df4fc1e4390733fe774b1a160dd41b4a3d83302a
2018-09-11 15:33:07 -07:00
EUROPE\laprosek 1658a4c080 Implement Image.queryCache on iOS (#18782)
Summary:
The API was available only on Android (with no mention to that effect in the docs, AFAICT).
This commit adds a simple iOS implementation based on NSURLCache. It should be possible to
query the decoded image cache as well to provide higher fidelity (i.e. "disk", "memory",
"decoded") if the caller passes size, scale, etc. in addition to the image URL, but it's
probably not worth the complexity. The assumption is that callers are interested in the
durability rather than performance aspect of the returned information.

Tested with RNTester on iPhone emulator.

[IOS] [ENHANCEMENT] [Image] - Implemented queryCache
Pull Request resolved: https://github.com/facebook/react-native/pull/18782

Differential Revision: D9411533

Pulled By: hramos

fbshipit-source-id: b430263959bb5f9b8ed9e28bb0a95f8879df881a
2018-08-20 16:17:18 -07:00
Mehdi Mulani affb135d62 Revert D8978844: [react-native][PR] Performance improvement for loading cached images on iOS
Differential Revision:
D8978844

Original commit changeset: 4b86043bc14c

fbshipit-source-id: fdf3ddd111c8c0dec6ddf2814a4e1e0ff58ef529
2018-07-30 14:46:30 -07:00
Eric Samelson 2ca7701aae Performance improvement for loading cached images on iOS (#20356)
Summary:
This PR increases the speed at which cached images are loaded and displayed on the screen. Images are currently cached in memory using RCTImageCache, but each time they are loaded, a round trip through RCTNetworking happens before RCTImageCache is even checked. This is likely so that RCTNetworking can handle the caching behavior required by the HTTP headers. However, this means that at the very least, images are read from disk each time they're loaded.

This PR makes RCTImageLoader check RCTImageCache _before_ sending a request to RCTNetworking. RCTImageCache stores a bit of information about the response headers so that it can respect Cache-Control fields without needing a roundtrip through RCTNetworking.

Here are a couple of graphs showing improved loading times before this change (blue) and after (red) with SDWebImage (yellow) as a baseline comparison. The increase is most evident when loading especially large (hi-res photo size) images, or loading multiple images at a time.
https://imgur.com/a/cnL47Z0

More performance gains can potentially be had by increasing the size limit of RCTImageCache: 1a6666a116/Libraries/Image/RCTImageCache.m (L39) but this comes at the tradeoff of being more likely to run into OOM crashes.
Pull Request resolved: https://github.com/facebook/react-native/pull/20356

Reviewed By: shergin

Differential Revision: D8978844

Pulled By: hramos

fbshipit-source-id: 4b86043bc14c40007b0596c9f8a213455b697686
2018-07-30 14:17:13 -07:00
Kyle Roach 746945824a fix(RCTImageLoader): Adds `requiresMainQueueSetup` to fix v0.52
Summary:
<!--
Thank you for sending the PR! We appreciate you spending the time to work on these changes.

Help us understand your motivation by explaining why you decided to make this change.

You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html

Happy contributing!

-->

In react-native v0.52 this warning shows:
```
"RCTImageLoader requires main queue setup
since it overrides `init` but doesn't implement `requiresMainQueueSetup`".
```
This removes the warning by implementing `requiresMainQueueSetup` on RCTImageLoader

* Create new react-native project
* Enable Remote JS Debugging
* Should see no warning regarding RCTImageLoader requiring main queue setup

<!--
Help reviewers and the release process by writing your own release notes

**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**

  CATEGORY
[----------]        TYPE
[ CLI      ]   [-------------]      LOCATION
[ DOCS     ]   [ BREAKING    ]   [-------------]
[ GENERAL  ]   [ BUGFIX      ]   [-{Component}-]
[ INTERNAL ]   [ ENHANCEMENT ]   [ {File}      ]
[ IOS      ]   [ FEATURE     ]   [ {Directory} ]   |-----------|
[ ANDROID  ]   [ MINOR       ]   [ {Framework} ] - | {Message} |
[----------]   [-------------]   [-------------]   |-----------|

[CATEGORY] [TYPE] [LOCATION] - MESSAGE

 EXAMPLES:

 [IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
 [ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
 [CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
 [DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
 [GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
 [INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
[IOS] [BUGFIX] [Libraries/Image/RCTImageLoader.m] - Implements `requiresMainQueueSetup`
Closes https://github.com/facebook/react-native/pull/17679

Reviewed By: shergin

Differential Revision: D7159601

Pulled By: fkgozali

fbshipit-source-id: e17bae67f4005d2c9ddd0d3701506521f3cac152
2018-04-03 16:41:43 -07:00
Sophie Alpert 1490ab12ef Update license headers for MIT license
Summary:
Includes React Native and its dependencies Fresco, Metro, and Yoga. Excludes samples/examples/docs.

find: ^(?:( *)|( *(?:[\*~#]|::))( )? *)?Copyright (?:\(c\) )?(\d{4})\b.+Facebook[\s\S]+?BSD[\s\S]+?(?:this source tree|the same directory)\.$
replace: $1$2$3Copyright (c) $4-present, Facebook, Inc.\n$2\n$1$2$3This source code is licensed under the MIT license found in the\n$1$2$3LICENSE file in the root directory of this source tree.

Reviewed By: TheSavior, yungsters

Differential Revision: D7007050

fbshipit-source-id: 37dd6bf0ffec0923bfc99c260bb330683f35553e
2018-02-16 18:31:53 -08:00
Yujie Liu 8f9b291224 Providing an API to load assets from a different directory
Differential Revision: D6368586

fbshipit-source-id: 2a79ba45de3d9c95d0b1b296c9e1ae35cbd33c36
2017-12-08 15:01:40 -08:00
Sai Teja Jammalamadaka 4e5d50d6ad Issue #16159 - RCTImageStoreManager's priority
Summary:
RCTImageStoreManager and RCTBlobManager have the same priority, hence in certain cases, both are able to handle the request, but this causes non-deterministic behavior. Hence increased ImageStoreManager's Priority to 1 and thereby increasing RCTImageLoader's Priority to 2 to prevent similar issue of same priorities.

Issue: #16159
Closes https://github.com/facebook/react-native/pull/16160

Differential Revision: D6017931

Pulled By: shergin

fbshipit-source-id: 91f2737af4f2f97197734b696105e1cdc5683365
2017-10-09 22:31:25 -07:00
Mark Smith 998197f444 Clean up some URL path handling
Reviewed By: sahrens

Differential Revision: D5753338

fbshipit-source-id: 0eb1b4ae64ad7170f1b97f398ff11b713c695b12
2017-09-01 13:45:03 -07:00
Aleksei Androsov ccc11f2f30 Fix Image.getSize() according to image orientation
Summary:
This is fix for issue https://github.com/facebook/react-native/issues/14097

I've prepared images with different exif orientation (https://yadi.sk/d/is_xcEEo3MRAxF)
0-4 should have size 200x100
5-8 should have size 100x200
Closes https://github.com/facebook/react-native/pull/15690

Differential Revision: D5731414

Pulled By: shergin

fbshipit-source-id: 7ced00ac7ac812c91216dccf0c76acd0e913dda0
2017-08-30 00:33:44 -07:00
Adlai Holler 114b0801ce RCTImage: Use C atomics instead of OSAtomic
Summary:
The next in my series of :atom: migrations.
Closes https://github.com/facebook/react-native/pull/15278

Differential Revision: D5526468

Pulled By: javache

fbshipit-source-id: 91511c69bc37a6f1382bcf0b0dd847adf10fd43a
2017-08-01 02:51:03 -07:00
Fred Liu 8dd15f2c87 Allow video uploads
Summary: Allows video uploads from native iOS by using the proper network handler, `RCTAssetsLibrary` rather than `RCTImageLoader`. Currently, uploading a camera roll video via its `assets-library://` URI would upload the first image frame. This fixes it by checking if the `assets-library://` URI is of the extension `MOV`, and if so, declines to process it from `RCTImageLoader`.

Reviewed By: javache

Differential Revision: D5223351

fbshipit-source-id: 8de92c5bb72acb02ed4d9fb92d69f68c8b5d1b36
2017-06-13 08:16:43 -07:00
Adam Comella 2aca021504 iOS: Fix dequeueTasks crash in image loader
Summary:
This fixes a crash occurring [on this line](f9f32eb426/Libraries/Image/RCTImageLoader.m (L253)). It was reported in a comment in #10433.

The problem is that `task` is deallocated at this point and is unsafe to use. Removing it from `_pendingTasks` dropped its ref count to 0. [The ARC docs](http://clang.llvm.org/docs/AutomaticReferenceCounting.html#fast-enumeration-iteration-variables) state that, by default, loop variables in fast enumeration loops are not retained. That's why `task`'s ref count is 0.

It's likely we ran into this bug because the code disobeyed the [reverseObjectEnumerator docs](https://developer.apple.com/reference/foundation/nsarray/1415734-reverseobjectenumerator) which state that "you must not modify the array during enumeration". The default retention policy for fast enumeration seems to assume you follow this.

To fix this bug and avoid other potential pitfalls, the code now follows the docs and `_pendingTa
Closes https://github.com/facebook/react-native/pull/11296

Differential Revision: D4277167

Pulled By: javache

fbshipit-source-id: 1211b32935bab7f4080dc00b88d85348786e859a
2016-12-05 10:13:29 -08:00
Adam Comella 23423774ba iOS: Fix an image loader crash
Summary:
Fixes #10433

The code didn't account for the fact that cancelLoad is set by two different threads. It gets set on the URL request queue when the request completes successfully and it gets set on the UI queue during cancelation. This oversight lead to a couple of different kinds of crashes.

1. Attempt to invoke a nil function -- We check that cancelLoad is non-nil and on the next line we call it. However, cancelLoad could have been set to nil by the other thread between the time it was verified to be non-nil and the time it was called. Consequently, the program will attempt to call nil and crash.

2. Block deallocated while it's executing -- Suppose cancelLoad points to a block, it is verified to be non-nil, and it is successfully invoked. In the middle of executing the block, cancelLoad, the last reference to the block, is set to nil. This causes the block to be deallocated and its captured values to be freed. However, the block continues executing and the next time it attempts to use a captured value
Closes https://github.com/facebook/react-native/pull/11145

Differential Revision: D4261499

Pulled By: javache

fbshipit-source-id: 46424c6dd8cfa085cef32d945308de07798040bc
2016-12-01 21:28:33 -08:00
Pieter De Baets e1577df1fd Move all header imports to "<React/..>"
Summary:
To make React Native play nicely with our internal build infrastructure we need to properly namespace all of our header includes.

Where previously you could do `#import "RCTBridge.h"`, you must now write this as `#import <React/RCTBridge.h>`. If your xcode project still has a custom header include path, both variants will likely continue to work, but for new projects, we're defaulting the header include path to `$(BUILT_PRODUCTS_DIR)/usr/local/include`, where the React and CSSLayout targets will copy a subset of headers too. To make Xcode copy headers phase work properly, you may need to add React as an explicit dependency to your app's scheme and disable "parallelize build".

Reviewed By: mmmulani

Differential Revision: D4213120

fbshipit-source-id: 84a32a4b250c27699e6795f43584f13d594a9a82
2016-11-23 07:58:39 -08:00
Alex Kotliarskyi d117f550a5 Provide more info when image fails to load
Reviewed By: javache

Differential Revision: D4209311

fbshipit-source-id: 6ad8ea6b8e236ec5ad2a2313a69b8985f9a06c74
2016-11-21 04:58:30 -08:00
Pieter De Baets 26be005b0a Cancel network requests from the correct queue
Summary: Fix suggested by sooth-sayer (https://github.com/facebook/react-native/pull/10280)

Reviewed By: mmmulani

Differential Revision: D4001618

fbshipit-source-id: cc28d19d02a29b62d2bdbddcd30f94b1c1bcfd76
2016-10-11 12:43:40 -07:00
Mattias Pfeiffer b2dac834fb Use strong reference in RCTImageLoader
Summary:
This PR is related to the multitude of crashes (#10016, #9751, #9882).

From my understanding, we should be using a strong reference when calling `decodeImageData` or we could be calling the method on a deallocated instance.

PR #9751 have mitigated this by adding a fail-safe, but I think the culprint is the weak reference, which this PR fixes.

Tested on iOS only, since it doesn't touch Android.
Closes https://github.com/facebook/react-native/pull/10147

Differential Revision: D3938763

fbshipit-source-id: 7389d4ae7a98926014401a1fe0cbbdcdd5ee6a01
2016-09-28 13:28:35 -07:00
Toby Cox 1a62b66c51 FIX #9751 - Cancelling offscreen image loads causing crashes
Summary:
This fixes https://github.com/facebook/react-native/issues/9751

We were seeing the same issues as the original reporter.

I'm not an expert on this code, so apologies if it's naive, but we haven't seen the crash since making this change.

From my understanding of it, it seems like the `cancelLoad` block was being released before the block returned by `_loadImageOrDataWithURLRequest:` was called.
This PR checks the `cancelled` flag before calling `cancelLoad()`.
Closes https://github.com/facebook/react-native/pull/10016

Differential Revision: D3902723

Pulled By: javache

fbshipit-source-id: 75cd115e28694105c6fc29469986998ca0d4cd09
2016-09-21 14:28:43 -07:00
Mehdi Mulani 820b1c0e46 Add partial image loading to RCTImageView
Reviewed By: javache

Differential Revision: D3856918

fbshipit-source-id: ca98f8604213e7e583a188ccc4c25ea9d7aa9aa2
2016-09-21 12:14:09 -07:00
Pieter De Baets 14188289fc Add some defensive cleanup of cancelBlock in RCTImageLoader
Reviewed By: mmmulani

Differential Revision: D3742177

fbshipit-source-id: 1cd16c2519052ec5811ecadf2530a5846b4ae1bc
2016-08-19 10:46:09 -07:00
Maria Mateescu 2a823bbc5c Add custom cache setter
Reviewed By: donyu

Differential Revision: D3622912

fbshipit-source-id: 675b3135212c73808cb18702c2cbf5684816df87
2016-08-01 22:13:27 -07:00
Maria Mateescu ddc70ffd85 Plug in the Cache to the ImageLoader
Reviewed By: donyu

Differential Revision: D3586563

fbshipit-source-id: 03f457df97066a522dc923b5f432314da40f7d71
2016-07-28 08:58:35 -07:00
Nathan Azaria ffb690f072 Fix RCTImageLoader's priority
Summary:
There is a conflict between RCTImageLoader and RCTAssetsLibraryRequestHandler on handling images, which was caused by making RCTPhotoLibraryImageLoader able to handle assets library requests as well. This gives more priority to RCTImageLoader instead.
Fixes #9031.

Reviewed By: mmmulani

Differential Revision: D3627451

fbshipit-source-id: 7ffd2c66f43ce1479c9a117768fb2d29f9d0dc08
2016-07-27 06:13:20 -07:00
Scott Wolchok eb59ae8423 Set trackingName for RCTImageLoader requests
Reviewed By: javache

Differential Revision: D3600853

fbshipit-source-id: 46ef2d0e54e4ce417cc3d4138c8d8f60d5c34173
2016-07-22 16:58:33 -07:00
skatpgusskat 631785f2ee Change RCTImageLoader's Cache System to default NSURLRequest's cache system
Summary:
Before this PR, ```RCTImageLodaer```'s Cache was too big(200MB on disk) and It doesn't work with HTTP Cache-Control header. So to provide dynamic image, the users must have to add random value on url( ex. adding current date) to avoid cache.

So I change that cache system to default ```NSURLRequest```'s cache system, which is well-working with HTTP specs. As the discussion on this issue #7571 , making custom cache policy processor is not ready yet and useless, over-tech things, I think.

Even we have no plan about image cache system(or would change plan later), before having a nice plan, I think we should let user use image module with common HTTP Specs.

So I remove custom ```NSURLCache```, and make logic like below,

1. try fetch image,

2. on response, get ```Date``` on response's header and make ```cacheKey``` with ```Date```.
> (why? because if ```NSURLRequest```'s response was cached, the response's ```Date``` header dosen't change.)

3. find decoded imag
Closes https://github.com/facebook/react-native/pull/8235

Reviewed By: bnham

Differential Revision: D3469086

Pulled By: javache

fbshipit-source-id: 35a5552cda6e6c367481020bbf3c28eb4a9d0207
2016-07-21 07:58:51 -07:00
Janic Duplessis 5903949ad6 Load local assets synchronously to prevent image flicker
Summary:
This uses `[UIImage imageNamed:]` to load local assets that are bundled using `require('../image/path.png')` and makes sure it is done synchronously on the main queue to prevent images from flickering. This improves user experience a lot when using large local images and prevents icon flickers to match the behaviour of most native apps.

This adds to methods to the ImageLoader protocol, one to tell if the image loader must be executed on the url cache queue and one to tell if the result of the image loader should be cached. I then use these to make the LocalImageLoader bypass the url cache queue and avoid caching images twice.

Note that this doesn't affect debug builds since images are loaded from the packager.

I'm not sure if we want to still support async loading of local images as I'm not sure how much of a perf difference this will make. Maybe someone at fb can benchmark this see how it affects your apps but there wasn't a noticeable one in mine. Also I only enabled this for loading png and jpg im
Closes https://github.com/facebook/react-native/pull/8102

Reviewed By: bnham

Differential Revision: D3433647

Pulled By: javache

fbshipit-source-id: 37bd6aff20c0465c163db3cdbcaeaedff55f7b1f
2016-07-21 07:58:51 -07:00
Pieter De Baets 7e5de707be Remove deprecated RCTImageLoader methods
Reviewed By: mmmulani

Differential Revision: D3586474

fbshipit-source-id: b2be11d3673c3db1f3a79e0c4abfead8c988d82a
2016-07-21 07:58:51 -07:00
Pieter De Baets 7fa677f7c3 Add MessageQueue method for executing function and returning its result
Reviewed By: majak

Differential Revision: D3175793

fbshipit-source-id: e1e66e3dcde8b1fb35973340e12d947a0e955775
2016-07-18 07:13:32 -07:00
yeshuang ca5d1aebab Defend against nil pointer in RCTImageLoader.m
Summary:
Defend against nil pointer in RCTImageLoader.m. In some rare case, the "response" might be nil, and this would lead to crash.

This issue is related: https://github.com/facebook/react-native/issues/6952
Closes https://github.com/facebook/react-native/pull/8141

Differential Revision: D3579427

Pulled By: javache

fbshipit-source-id: 7b71768a0c6d74a42d280b1d54adda86b493f0ef
2016-07-18 04:58:29 -07:00
Pieter De Baets ff3ab32a72 Cleanup RCTImageLoader weakSelf/strongSelf
Reviewed By: mmmulani

Differential Revision: D3542393

fbshipit-source-id: b241586b0da254f688d0e8bdbf7d4ce72dc0d21f
2016-07-11 13:34:00 -07:00
Skotch Vail bcf4bb6edd Automated changes to remove implicit capture of self in blocks: Libraries/FBReactKit/BUCK
Reviewed By: javache

Differential Revision: D3442470

fbshipit-source-id: 584a2bb3df5f7122166778b8fd44fae45560491e
2016-07-07 12:44:14 -07:00
Nick Lockwood 235749ba19 Fix missing images
Summary:
Under rare and as-yet-to-be determined circumstances, images can sometimes fail to load/download and get "stuck", without producing an error.

Because the `RCTNetworkTask` for these images is stuck in the "in progress" state, they clog up the RCTImageLoader task queue, which has a limit of 4 concurrent in-progress tasks.

This was previously masked by the fact that we automatically cancelled image requests when the RCTImageView moved offscreen, but we no longer do that.

This diff adds logic to detect some types of stuck task and remove them, thereby unblocking the queue. I've also restored the functionality of cancelling downloads for offscreen images (but not unloading the image itself) so that stuck images will be cancelled when you move to another screen, instead of using up space in the queue forever.

Reviewed By: fkgozali

Differential Revision: D3398105

fbshipit-source-id: 75ee40d06a872ae8e1cb57f02f9cad57c459143c
2016-06-09 09:58:31 -07:00
Maarten Schumacher 39eca05b91 Handle the case where redirect URL is relative
Summary:
While trying to download an image I encountered an error:

![screen shot 2016-05-31 at 13 58 54](https://cloud.githubusercontent.com/assets/10407025/15799726/a7bcbf1c-2a5d-11e6-926a-b2f84e011258.png)

As you can see the domain name is missing from the URL. I traced it back to a method which handles redirects. It would retrieve the redirect URL from the `Location` header field, but it didn’t handle the case where `Location` contains a relative URL (which [according to the RFC spec](https://tools.ietf.org/html/rfc7231#section-7.1.2), is allowed).
Closes https://github.com/facebook/react-native/pull/7926

Differential Revision: D3399531

Pulled By: nicklockwood

fbshipit-source-id: ffbd5e9fc55b1737a8ff6a9bcc06fb1f9f19d093
2016-06-07 12:13:30 -07:00
Nick Lockwood 748a507861 Simplified Image.js
Summary:
Now that we no longer have a separate NetworkImageView implementation, we can remove that code path from Image.js

I've also moved the prefetch method into RCTImageViewManager for consistency with the getImageSize method, which means we no longer need to export the RCTImageLoader module to js.

Reviewed By: javache

Differential Revision: D3398157

fbshipit-source-id: fbbcf90a61549831ad28bad0cb3b50c375aae32c
2016-06-07 05:43:28 -07:00
Nick Lockwood 72b363d7fc Replaced isMainThread checks with a proper test for main queue
Summary:
As per https://twitter.com/olebegemann/status/738656134731599872, our use of "main thread" to mean "main queue" seems to be unsafe.

This diff replaces the `NSThread.isMainQueue` checks with dispatch_get_specific(), which is the recommended approach.

I've also replaced all use of "MainThread" terminology with "MainQueue", and taken the opportunity to deprecate the "sync" param of `RCTExecuteOnMainThread()`, which, while we do still use it in a few places, is incredibly unsafe and shouldn't be encouraged.

Reviewed By: javache

Differential Revision: D3384910

fbshipit-source-id: ea7c216013372267b82eb25a38db5eb4cd46a089
2016-06-06 07:58:36 -07:00
Adam Comella ee8496f364 iOS: Support HTTP headers for source prop on <Image> components
Summary:
Allows developers to specify headers to include in the HTTP request
when fetching a remote image. For example, one might leverage this
when fetching an image from an endpoint that requires authentication:

```
<Image
  style={styles.logo}
  source={{
    uri: 'http://facebook.github.io/react/img/logo_og.png',
    headers: {
      Authorization: 'someAuthToken'
    }
  }}
/>
```

Note that the header values must be strings.

Works on iOS and Android.

**Test plan (required)**

- Ran a small example like the one above on iOS and Android and ensured the headers were sent to the server.
- Ran a small example to ensure that \<Image\> components without headers still work.
- Currently using this code in our app.

Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/7338

Reviewed By: javache

Differential Revision: D3371458

Pulled By: nicklockwood

fbshipit-source-id: cdb24fe2572c3ae3ba82c86ad383af6d85157e20
2016-06-01 10:43:28 -07:00
Nick Lockwood b49633e020 Fixed image test flakiness by tying decoded image cache to module lifecycle
Summary: The decoded image cache was previously static, meaning that cached images could persist beyond the lifetime of the module. This resulted in some flakiness in the RCTImageLoaderTests due to the loader returning cached image instanced from previous tests instead of the correct instance.

Reviewed By: bestander

Differential Revision: D3346329

fbshipit-source-id: 375af8894cef1c5b6303c6cdfd7eb57ebcfe3251
2016-05-25 06:58:23 -07:00
Nick Lockwood c8f39c3d2c Added small decoded image cache to prevent images flashing when component is reloaded
Summary:
In RN we cache image data after loading/downloading an image, however the data we store is the compressed image data, and we decode this asynchronously each time it is displayed.

This can lead to a slight flicker when reloading image components because the decoded image is discarded and then re-decoded.

This diff adds a small (5MB) cache for decoded images so that images that are currently on screen shouldn't flicker any more if the component is reloaded.

Reviewed By: bnham

Differential Revision: D3305161

fbshipit-source-id: 9969012f576784dd6f37d9386cbced2df00c3e07
2016-05-23 03:43:30 -07:00
Nick Lockwood ed1ee9bc0f Fixed crash due to inserting a nil object into an array
Summary: Fixed a crash where making a network request with unrecognized/unsupported scheme would crash by attempting to insert a nil RCTNetworkTask into an array.

Reviewed By: javache

Differential Revision: D3275810

fb-gh-sync-id: be208c6bf87d882209901b850dcc25da4ba79a08
fbshipit-source-id: be208c6bf87d882209901b850dcc25da4ba79a08
2016-05-09 08:18:47 -07:00
Howard Yeh 192ab663b7 Fix 302 ImageLoader caching problem on iOS
Summary:
+ Fixes https://github.com/facebook/react-native/issues/5616
+ Bug RNPlay Demo: https://rnplay.org/apps/Eg2goQ

Test demo loads a Tumblr avatar image using a URL that 301 to a CDN. Try to edit and save the file to trigger image reloads.

The 302 image request succeeds the first time:

<img width="318" alt="screen shot 2016-04-27 at 9 37 03 am" src="https://cloud.githubusercontent.com/assets/50120/14860038/b2c04e8a-0c5b-11e6-9edf-78309048368b.png">

But it fails for subsequent loads. You should see:

<img width="307" alt="screen shot 2016-04-27 at 9 37 22 am" src="https://cloud.githubusercontent.com/assets/50120/14860048/b756e170-0c5b-11e6-9031-8f3cca8f2994.png">

+ The first image is a 302, only succeeds to load the first time.
+ The second image in the column adds a nonce as request parameter to render caching ineffective (but still a 302), and the problem doesn't occur.
+ The last image is the canonical url location (200).

Although NSURLSession hand
Closes https://github.com/facebook/react-native/pull/7262

Differential Revision: D3231702

Pulled By: javache

fb-gh-sync-id: 364fcf9819188c63310768411d49e6431b2a01d3
fbshipit-source-id: 364fcf9819188c63310768411d49e6431b2a01d3
2016-04-27 14:40:30 -07:00
James Ide f7bcb3e98d Add a way to prefetch remote images to cache with Image.prefetch
Summary:Adds `Image.prefetch` to prefetch remote images before they are used in an actual `Image` component. This is based off of #4420 by sospartan and skevy's work.
Closes https://github.com/facebook/react-native/pull/6774

Differential Revision: D3153729

Pulled By: bestander

fb-gh-sync-id: ef61412e051a49b42ae885edce7905a8ca0da23f
fbshipit-source-id: ef61412e051a49b42ae885edce7905a8ca0da23f
2016-04-13 07:30:28 -07:00
Marc Horowitz 7a2698475e Replace :React with :FBReactOpenSourceKit
Reviewed By: javache

Differential Revision: D3055168

fb-gh-sync-id: 68cf6ab19ef1a2c8e7c9670474eeddd227412a34
shipit-source-id: 68cf6ab19ef1a2c8e7c9670474eeddd227412a34
2016-03-21 11:37:22 -07:00
Nick Lockwood dc13115445 Dispatch module setup asynchronously to avoid blocking main thread when bridge starts
Summary:Initializing native modules can block the main thread for tens of milliseconds when it starts up, making it difficult to instantiate the bridge on demand without causing a performance blip.

This diff splits up the initialization of modules so that - although they still happen on the main thread - they don't block the thread continuously.

Reviewed By: javache

Differential Revision: D2965438

fb-gh-sync-id: 38c9c9d281e4672b5874d68b57d4c60d1d268344
shipit-source-id: 38c9c9d281e4672b5874d68b57d4c60d1d268344
2016-03-03 02:21:36 -08:00
Nick Lockwood 0427c3d273 Added throttling on requests made by RCTImageLoader
Reviewed By: javache

Differential Revision: D2938143

fb-gh-sync-id: bac1185d4792dcca0012905126c9ef2aa45905d5
shipit-source-id: bac1185d4792dcca0012905126c9ef2aa45905d5
2016-02-16 12:42:34 -08:00
Nick Lockwood 915e5826ef Restricted image decoding to 2 simultaneous threads
Reviewed By: zjj010104

Differential Revision: D2922292

fb-gh-sync-id: eddd47d02fc721acc1da69e7483c6570997320b5
shipit-source-id: eddd47d02fc721acc1da69e7483c6570997320b5
2016-02-10 12:54:11 -08:00
Nick Lockwood 21fcbbc32c Generalized image decoding and resizing logic
Summary:
public

Standardises the image decoding logic for all image sources, meaning we get the benefits of efficient downscaling of images from all sources, not just ALAssets.

Reviewed By: javache

Differential Revision: D2647083

fb-gh-sync-id: e41456f838e4c6ab709b1c1523f651a86ff6e623
2016-01-20 11:11:13 -08:00
Nick Lockwood 718cd7953f Added getImageSize method
Summary:
public

This diff adds a `getSize()` method to `Image` to retrieve the width and height of an image prior to displaying it. This is useful when working with images from uncontrolled sources, and has been a much-requested feature.

In order to retrieve the image dimensions, the image may first need to be loaded or downloaded, after which it will be cached. This means that in principle you could use this method to preload images, however it is not optimized for that purpose, and may in future be implemented in a way that does not fully load/download the image data.

A fully supported way to preload images will be provided in a future diff.

The API (separate success and failure callbacks) is far from ideal, but until we agree on a unified standard, this was the most conventional way I could think of to implement it. If it returned a promise or something similar, it would be unique among all such APIS in the framework.

Please note that this has been a long time coming, in part due to much bikeshedding about what the API should look like, so while it's not unlikely that the API may change in future, I think having *some* way to do this is better than waiting until we can define the "perfect" way.

Reviewed By: vjeux

Differential Revision: D2797365

fb-gh-sync-id: 11eb1b8547773b1f8be0bc55ddf6dfedebf7fc0a
2015-12-31 18:51:30 -08:00
Nick Lockwood 060664fd3d Refactored module access to allow for lazy loading
Summary: public

The `bridge.modules` dictionary provides access to all native modules, but this API requires that every module is initialized in advance so that any module can be accessed.

This diff introduces a better API that will allow modules to be initialized lazily as they are needed, and deprecates `bridge.modules` (modules that use it will still work, but should be rewritten to use `bridge.moduleClasses` or `-[bridge moduleForName/Class:` instead.

The rules are now as follows:

* Any module that overrides `init` or `setBridge:` will be initialized on the main thread when the bridge is created
* Any module that implements `constantsToExport:` will be initialized later when the config is exported (the module itself will be initialized on a background queue, but  `constantsToExport:` will still be called on the main thread.
* All other modules will be initialized lazily when a method is first called on them.

These rules may seem slightly arcane, but they have the advantage of not violating any assumptions that may have been made by existing code - any module written under the original assumption that it would be initialized synchronously on the main thread when the bridge is created should still function exactly the same, but modules that avoid overriding `init` or `setBridge:` will now be loaded lazily.

I've rewritten most of the standard modules to take advantage of this new lazy loading, with the following results:

Out of the 65 modules included in UIExplorer:

* 16 are initialized on the main thread when the bridge is created
* A further 8 are initialized when the config is exported to JS
* The remaining 41 will be initialized lazily on-demand

Reviewed By: jspahrsummers

Differential Revision: D2677695

fb-gh-sync-id: 507ae7e9fd6b563e89292c7371767c978e928f33
2015-11-25 04:49:45 -08:00
Nick Lockwood f827a513a1 Fixed double-callback for cached images
Summary: public

A missing return statement in RCTImageLoader meant that cached images would be loaded twice - once from cache and again from the source.

This was mostly innocuous, causing only a slight perf regression due to the image cache being effectively disabled, however in some cases (such as RCTImageEditingManager.cropImage) it caused the success callback to fire twice, resulting in a crash.

Reviewed By: fkgozali

Differential Revision: D2684956

fb-gh-sync-id: 7580a6fbfe00a30807951803e04bfcdbee3bb80a
2015-11-23 04:20:28 -08:00