Commit Graph

234 Commits

Author SHA1 Message Date
Tadeu Zagallo 2a08897c6e [ReactNative] Batch JS -> Native calls per queue
Summary:
@public

For every call that comes from JS to Native we'd call dispatch_async so the
method would be cllead on the queue/thread it's expecting. This diff
buckets the calls by target queue, dispatches only once to that queue, and then
call all the methods for it inside the same dispatch.

Test Plan: {F22510090}
2015-06-09 06:52:54 -08:00
Tadeu Zagallo de1320acc7 [ReactNative] Check if bridge is valid on -modules 2015-06-09 02:54:59 -08:00
Tadeu Zagallo c2fb21b322 [ReactNative] Properly pause frame update observers when idle
Summary:
@public

`RCTDispatchEvent` and `RCTTiming` weren't being paused when there wasn't any
work left to be done.

Test Plan:
Run the timers example - check everything still works as expected
Test the ListView paging example - check scroll events are still fired as expected
Launch UIExplorer, let it idle, and put a break point on `-[RCTBridge dispatchBlock:moduleID:]`,
it should never fire.
2015-06-07 08:45:18 -08:00
Tadeu Zagallo 1c9e957d22 [ReactNative] Invalidate modules on their own queues
Summary:
@public

Bridge modules were being invalidate on the main thread, what could lead to
racing conditions, move the calls to invalidate on happen to the module's
methodQueue

Test Plan: Run the tests
2015-06-06 14:13:32 -08:00
Tadeu Zagallo 35b770201d [ReactNative] Merge IntegrationTest into UIExplorer tests 2015-06-06 13:38:35 -08:00
Nick Lockwood 45d8fb0ef6 Removed deprecated RCT_EXPORT + code paths 2015-06-05 09:58:25 -08:00
Tadeu Zagallo 7009f0a47b [ReactNative] Add profiling hooks to bridge modules at runtime
Summary:
@public

Add `RCT_DEV`-only profiling hooks to every method in every bridge modules to
add a little bit more detail to the timeline profile.

Test Plan: {F22522834}
2015-06-05 04:22:57 -08:00
Eric Vicenti f744c7c444 [ReactNative] Native touch unique identifier
Summary:
This bug was causing a redbox when touching rapidly because multiple touches had the same identifier. This code was meant to ensure that a unique ID is found, but it was checking against the wrong property in the react touch array.

I don't think this was really affecting prod, because the invariant is guarded by a __DEV__ check

@public

Test Plan:
- Start several touches at once (or just rapidly jam fingers on your device), and you won't see a redbox
- Also verify that single touches, touch moves, and multi touches work as before
2015-06-04 20:21:19 -08:00
Spencer Ahrens 7ffa7bd1f1 [ReactNative] Implement merge functionality for AsyncStorage 2015-06-03 16:53:29 -08:00
Alex Kotliarskyi 9fe7128493 [ReactNative] Refactor DevMenu items construction
Summary:
The idea behind this change it to couple together menu item title
and handler. The code becomes simpler and easier to maintain, but
also makes it possible to extend dev menu in the future.

@public

Test Plan:
All menu items works as before.
Changed websocket executor class name and made sure that when the class
is missing we get nice error message.
2015-06-03 16:42:23 -08:00
Eric Vicenti fa3491e9f5 [ReactNative] Remove unused touch arrays
Summary:
These two arrays aren't used. The code is easier to read without them

@public

Test Plan: Tap around UIExplorer and verify multi-touch and responder system behavior works the same
2015-06-03 16:12:03 -08:00
Jared Forsyth bba576a172 press ctrl-i to toggle inspect element 2015-06-03 10:30:06 -08:00
Nick Lockwood e68f89bfad Added ProgressViewIOS 2015-06-03 09:49:35 -08:00
Tadeu Zagallo 158d8b64ff [ReactNative] Track bridge events' flow (timers fixed)
Summary:
@public

Use trace-viewer's flow events to link the bridge calls

Test Plan: {F22498582}
2015-06-03 05:37:10 -08:00
Spencer Ahrens d796584b6c [ReactNative] ErrorUtils.reportError shouldn't redbox
Summary:
@public

ErrorUtils.reportError is intended for reporting handled errors to the
server, like timeouts, which means that we shouldn't shove them in the
developer's face.

Test Plan: add `require('ErrorUtils').reportError(new Error('error'))` and see a useful error message with stack but no redbox.  Debugger confirms `reportSoftException` is called but it doesn't do anything yet.  `reportFatalError` and throwing exceptions still show redboxes.
2015-06-02 17:47:49 -08:00
Chace Liang 4d4f2dfe09 Revert "[ReactNative] Track bridge events' flow" 2015-06-02 10:36:32 -08:00
Tadeu Zagallo 0f16d15d64 [ReactNative] Optimize console.profile and add markers on JS entry points
Summary:
@public

Right now the profiler shows how long the executor took on JS but doesn't show
how long each of the batched calls took, this adds a *very* high level view of JS
execution (still doesn't show properly calls dispatched with setImmediate)

Also added a global property on JS to avoid trips to Native when profiling is
disabled.

Test Plan:
Run the Profiler on any app

{F22491690}
2015-06-02 06:22:49 -08:00
Tadeu Zagallo 2dfa3b34a1 [ReactNative] Track bridge events' flow
Summary:
@public

Use trace-viewer's flow events to link the bridge calls

Test Plan: {F22498582}
2015-06-02 06:19:16 -08:00
Tadeu Zagallo 777363fdd7 [ReactNative] Use NSDictionary + NSNumber for event coalescing
Summary:
@public

On D2099270 event coalescing was implemented and the event key on the RCTSparseArray
is an uint64_t, but it was declared as NSUInteger.  On a 32 bits architecture
it'll be clipped to 4 bits, meaning that just `reactTag` will be taken into
account, e.g. different types of events can coalesce with each other if they target the same view

Switching to use an NSMutableDictionary instead of RCTSparseArray and NSNumber
as keys instead of uint64_t

Test Plan: Fixed the previous tests and added a new test to RCTEventDispatcherTests
2015-06-02 03:06:06 -08:00
John Harper dc6fd82231 [react-native] -mountOrUnmountSubview: should handle zero-sized clip-rects correctly 2015-06-02 01:48:21 -08:00
John Harper 570597c4ac [react-native] dispatch perf updates to main thread 2015-06-02 01:44:55 -08:00
Chace Liang 1ed2542b46 Revert "[Bridge] Add support for JS async functions to RCT_EXPORT_METHOD" 2015-06-01 20:26:37 -08:00
James Ide d548c85da6 [Bridge] Add support for JS async functions to RCT_EXPORT_METHOD
Summary:
Adds support for JS async methods and helps guide people writing native modules w.r.t. the callbacks. With this diff, on the native side you write:

```objc
RCT_EXPORT_METHOD(getValueAsync:(NSString *)key
                       resolver:(RCTPromiseResolver)resolve
                       rejecter:(RCTPromiseRejecter)reject)
{
  NSError *error = nil;
  id value = [_nativeDataStore valueForKey:key error:&error];

  // "resolve" and "reject" are automatically defined blocks that take
  // any object (nil is OK) and an NSError, respectively
  if (!error) {
    resolve(value);
  } else {
    reject(error);
  }
}
```

On the JS side, you can write:

```js
var {DemoDataStore} = require('react-native').NativeModules;
DemoDataStore.getValueAsync('sample-key').then((value) => {
  console.log('Got:', value);
}, (error) => {
  console.error(error);
  // "error" is an Error object whose message is the NSError's description.
  // The NSError's code and domain are also set, and the native trace i
Closes https://github.com/facebook/react-native/pull/1232
Github Author: James Ide <ide@jameside.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-06-01 10:50:06 -08:00
Nick Lockwood 49e87af934 Fixed text update on OSS 2015-06-01 08:44:11 -08:00
Tadeu Zagallo b03446e27e [ReactNative] Stop traversing the whole view hierarchy every frame
Summary:
@public

`RCTUIManager` would traverse the whole view hierarchy every time there was any
call from JS to Native to call `reactBridgeDidFinishTransaction` on the views
that would respond to it. This is a deprecated method that is only implemented
by 3 classes, so for now we keep track of these views as they're created and
just iterate through them on updates.

Test Plan:
> NOTE: I tested this on UIExplorer, since the internally none of the classes are used

I tried to keep it simple, so I added the following to the old code:
```
__block NSUInteger count = 0;
UIView *rootView = _viewRegistry[rootViewTag];
RCTTraverseViewNodes(rootView, ^(id<RCTViewNodeProtocol> view) {
  count ++;
  if ([view respondsToSelector:@selector(reactBridgeDidFinishTransaction)]) {
    [view reactBridgeDidFinishTransaction];
  }
});
NSLog(@"Views iterated: %zd", count);
```
The output after scrolling 20 sections of the `<ListView> - Paging` example was

```
2015-06-01 00:47:07.351 UIExplorer[67675:1709506] Views iterated: 1549
```

*every frame*

After the change

```
for (id<RCTViewNodeProtocol> node in _bridgeTransactionListeners) {
  [node reactBridgeDidFinishTransaction];
}
NSLog(@"Views iterated: %zd", _bridgeTransactionListeners.count);
```

```
2015-06-01 00:51:23.715 UIExplorer[70355:1716465] Views iterated: 3
```

No matter how many pages are loaded, the output is always 3.
2015-06-01 03:14:14 -08:00
Jiajie Zhu df58789f22 [RN] fix duplicate observe 2015-05-31 14:46:38 -08:00
Tadeu Zagallo 1c692e2eb6 [ReactNative] Use JSValueIsUndefined instead of comparing with JSValueMakeUndefined
Summary:
@public

Use JSValueIsUndefined instead of caching an JSValueMakeUndefined to compare with
as suggested in https://github.com/facebook/react-native/pull/1432#commitcomment-11437434

Test Plan: Run the RCTContextExecutor tests
2015-05-30 13:32:11 -08:00
Nick Lockwood 36c33b4a60 Fixed delayed text layout bug 2015-05-29 10:43:13 -08:00
Alex Akers 40da2c7e08 [React Native] Add E2E tests for Catalyst that test login, app launcher, and opening UIExplorer, MAdMan, Groups 2015-05-29 05:30:09 -08:00
Nick Lockwood 03889780b9 [WIP] Added loadingView property to RCTRootView 2015-05-28 13:20:46 -08:00
Nick Lockwood 45c1dc1c65 Fixed text background color
Summary:
@public

This fixes an issue with the containerBackgroundColor property of `<Text>` nodes, where containerBackgroundColor was being overridden by the backgroundColor. I also fixed up the example so that it demonstrates the feature more clearly.

Test Plan:
* Check UIExplorer text example
* Run Catalyst snapshot tests and check MAdMan, Groups
2015-05-28 09:31:57 -08:00
Jason Prado 656c5e4e27 Revert "[ReactNative] Add completionBlock to -[RCTBridge enqueueJSCall:args:]"
Test plan: broke catalyst apps

Summary: This reverts commit 9fba6a360dc5f8bf.

fbobjc/Tools/revert

Reverter: jprado

@build-break

commit 9fba6a360dc5f8bf014f3d3c584c545b16da5100
Author:     Tadeu Zagallo <tadeuzagallo@fb.com>
AuthorDate: Thu May 28 08:29:19 2015 -0700
Commit:     Service User <svcscm@fb.com>
CommitDate: Thu May 28 09:53:53 2015 -0700

    [ReactNative] Add completionBlock to -[RCTBridge enqueueJSCall:args:]

    Summary:
    @public

    Allow to pass an optional completion block to the bridge JS calls.

    The block will be called from the JS thread, after the javascript has finished
    running and the returned calls have been processed/dispatched to the native modules.

    Test Plan: Added `testCallbackIsCalledOnTheRightTime` to `RKBatchedBridgeTests`
2015-05-28 09:30:51 -08:00
Nick Lockwood ff49d86aed Implemented fast path for same borders/radii 2015-05-28 09:16:44 -08:00
Tadeu Zagallo 3b24f52a20 [ReactNative] Add completionBlock to -[RCTBridge enqueueJSCall:args:]
Summary:
@public

Allow to pass an optional completion block to the bridge JS calls.

The block will be called from the JS thread, after the javascript has finished
running and the returned calls have been processed/dispatched to the native modules.

Test Plan: Added `testCallbackIsCalledOnTheRightTime` to `RKBatchedBridgeTests`
2015-05-28 08:53:53 -08:00
Tadeu Zagallo 4fc15dbf17 [ReactNative] Implement proper event coalescing 2015-05-27 20:41:20 -08:00
Nick Lockwood acc42e193d Big reduction in blending 2015-05-27 16:10:54 -08:00
Nick Lockwood 455281e44d Fixed crash in RCTContextExecutor when requireJSRef == undefined 2015-05-27 08:50:03 -08:00
Nick Lockwood 8d992262ed Fixed loading flicker on RCTRootView 2015-05-27 02:51:32 -08:00
Spencer Ahrens a4442e4576 [ReactNative] rename nativeProps const to NativeProps 2015-05-26 19:28:07 -08:00
Nick Lockwood 0689c0790e Fixed crash in RCTText due to NSTextContainer/NSLayoutManager being accessed concurrently from main and shadow queues 2015-05-26 18:52:46 -08:00
Brent Vatne 95517fca41 [RCTScrollView] Make ScrollView detect taps on sticky headers
Summary:
As per discussion with @nicklockwood in #875, make `RCTScrollView` check its sticky headers for hitTests first.

Closes https://github.com/facebook/react-native/pull/1415
Github Author: Brent Vatne <brent.vatne@madriska.com>

Test Plan:
 Have a sticky header in a ScrollView with a Touchable onPress action, scroll a bit after it docks and try tapping, should respond to tap.
2015-05-26 18:30:22 -08:00
Stan Chollet 76ea00483d TabBarIOS tintColor
Summary:
[Origin Pull request](https://github.com/facebook/react-native/pull/961) from [cmcewen](https://github.com/cmcewen)

All the work have been done by @cmcewen, I just rebased his work with the master.
Closes https://github.com/facebook/react-native/pull/1337
Github Author: Stan Chollet <stanislas.chollet@gmail.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-26 17:21:36 -08:00
Nick Lockwood e5b134368b Fixed crash due to nil backgroundColor 2015-05-26 12:59:24 -08:00
Alex Kotliarskyi cfa4b13472 [ReactNative] Element Inspector
Summary:
This adds new development feature to React Native that provides information
about selected element (see the demo in Test Plan).

This is how it works:

App's root component is rendered to a container that also has a hidden layer called
`<InspectorOverlay/>`. When activated, it shows full screen view and captures all
touches. On every touch we ask UIManager to find a view for given {x,y} coordinates.

Then, we use React's internals to find corresponding React component. `setRootInstance`
is used to remember the top level component to start search from, lmk if you have a
better idea how to do this. Given a component, we can climb up its owners tree
to provice more context on how/where the component is used.

In future we could use the `hierarchy` array to inspect and print their props/state.

Known bugs and limitations:
* InspectorOverlay sometimes receives touches with incorrect coordinates (wtf)
* Not integrated with React Chrome Devtools (maybe in followup diffs)
* Doesn't work with popovers (maybe put the element inspector into an `<Overlay/>`?)

@public

Test Plan:
https://www.facebook.com/pxlcld/mn5k
Works nicely with scrollviews
2015-05-26 11:19:49 -08:00
Nick Lockwood b7c669aa73 Fixed root view background color propagation 2015-05-26 04:18:55 -08:00
Alex Akers 81401064e5 [React Native] Fix view clipping when border radius is set 2015-05-26 02:17:07 -08:00
Tadeu Zagallo 9062bda79b [ReactNative] Add RCTAssertThread and restrict -[UIManager addUIBlock:] to _shadowQueue
Summary:
@public

Add `RCTAssertThread` to `RCTAssert.h` for convenience when checking the current/queue,
it accepts either a `NSString *`, `NSThread *` or `dispatch_queue_t` as the object to be checked

Also add a check to `-[RCTUIManager addUIBlock:]` - There was a discussion on github (https://github.com/facebook/react-native/issues/1365)
due to the weird behavior caused by calling it from a different thread/queue (it might be added after `batchDidComplete` has been called
and will just be dispatched on the next call from JS to objc)

Test Plan:
Change `-[RCTAnimationExperimentalManager methodQueue]` to return `dispatch_get_main_queue()` and run the 2048 example,
it should dispatch with a helpful message (screenshot on the comments)
2015-05-25 05:23:27 -08:00
Robert Payne c91e2eb567 Use JSC C API for better invocation speed
Summary:
This converts the existing JSEvaluateScript call for `require('<ModuleName>').<MethodName>.apply(null, <args>);` to native JSC C API methods which shaves off about 10-15% of invocation time on average, I used pretty primitive profiling methods to track the minimum, maximum and average invocation time so would appreciate any extra eyes on the performance.

If the argument count is zero the method is invoked directly with no arguments, if the argument count is 1 it's invoked directly with just that argument. If there is more than 1 argument then apply is used and the arguments are passed as the second parameter.

Ensured all existing tests pass and instruments leaks shows nothing is leaking.
Closes https://github.com/facebook/react-native/pull/1037
Github Author: Robert Payne <robertpayne@me.com>

Test Plan: Imported from GitHub, without a `Test Plan:` line.
2015-05-22 19:37:18 -08:00
Jared Forsyth aad54006e3 Observing "MemoryWarningNotification" and proxying it up to the DeviceEventEmitter 2015-05-22 13:09:56 -08:00
Nick Lockwood fe4b4c2d83 Optimised blending for translucent images with opaque background color + fixed cropping for images in cover/contain mode.
Summary:
@public

Our background color propagation mechanism is designed to make rendering of translucent content more efficient by pre-blending against an opaque background. Currently this only works for text however, because images are not composited into their background even if the background color is opaque.

This diff precomposites network images with their background color when the background is opaque, allowing them to take advantage of this performance optimization.

I've also added some logic to correctly crop the downloaded image when the resizeMode is "cover" or "contain" - previously it was only correct for "stretch".

Before:{F22437859}
After:{F22437862}

Test Plan: Run the UIExplorer "<ListView> - Paging" example with "color blended layers" enabled and observe that the images appear in green now, instead of red as they did before.
2015-05-22 07:19:06 -08:00