Show bundle download progress on iOS

React/Base/RCTJavaScriptLoader.mm

@@ -198,7 +198,6 @@ static void attemptAsynchronousLoadOfBundleAtURL(NSURL *scriptURL, RCTSourceLoad
     return;
   }
 
-
   RCTMultipartDataTask *task = [[RCTMultipartDataTask alloc] initWithURL:scriptURL partHandler:^(NSInteger statusCode, NSDictionary *headers, NSData *data, NSError *error, BOOL done) {
     if (!done) {
       if (onProgress) {
@@ -244,6 +243,11 @@ static void attemptAsynchronousLoadOfBundleAtURL(NSURL *scriptURL, RCTSourceLoad
       return;
     }
     onComplete(nil, data, data.length);
+  } progressHandler:^(NSDictionary *headers, NSNumber *loaded, NSNumber *total) {
+    // Only care about download progress events for the javascript bundle part.
+    if ([headers[@"Content-Type"] isEqualToString:@"application/javascript"]) {
+      onProgress(progressEventFromDownloadProgress(loaded, total));
+    }
   }];
 
   [task startTask];
@@ -270,6 +274,16 @@ static void attemptAsynchronousLoadOfBundleAtURL(NSURL *scriptURL, RCTSourceLoad
   return progress;
 }
 
+static RCTLoadingProgress *progressEventFromDownloadProgress(NSNumber *total, NSNumber *done)
+{
+  RCTLoadingProgress *progress = [RCTLoadingProgress new];
+  progress.status = @"Downloading JavaScript bundle";
+  // Progress values are in bytes transform them to kilobytes for smaller numbers.
+  progress.done = done != nil ? @([done integerValue] / 1024) : nil;
+  progress.total = total != nil ? @([total integerValue] / 1024) : nil;
+  return progress;
+}
+
 static NSDictionary *userInfoForRawResponse(NSString *rawText)
 {
   NSDictionary *parsedResponse = RCTJSONParse(rawText, nil);

React/Base/RCTMultipartDataTask.h

@@ -15,7 +15,10 @@ typedef void (^RCTMultipartDataTaskCallback)(NSInteger statusCode, NSDictionary
 
 @interface RCTMultipartDataTask : NSObject
 
-- (instancetype)initWithURL:(NSURL *)url partHandler:(RCTMultipartDataTaskCallback)partHandler;
+- (instancetype)initWithURL:(NSURL *)url
+                partHandler:(RCTMultipartDataTaskCallback)partHandler
+            progressHandler:(__nullable RCTMultipartProgressCallback)progressHandler;
+
 - (void)startTask;
 
 @end

React/Base/RCTMultipartDataTask.m

@@ -30,17 +30,21 @@ static BOOL isStreamTaskSupported() {
 @implementation RCTMultipartDataTask {
   NSURL *_url;
   RCTMultipartDataTaskCallback _partHandler;
+  RCTMultipartProgressCallback _progressHandler;
   NSInteger _statusCode;
   NSDictionary *_headers;
   NSString *_boundary;
   NSMutableData *_data;
 }
 
-- (instancetype)initWithURL:(NSURL *)url partHandler:(RCTMultipartDataTaskCallback)partHandler
+- (instancetype)initWithURL:(NSURL *)url
+                partHandler:(RCTMultipartDataTaskCallback)partHandler
+            progressHandler:(RCTMultipartProgressCallback)progressHandler
 {
   if (self = [super init]) {
     _url = url;
     _partHandler = [partHandler copy];
+    _progressHandler = [progressHandler copy];
   }
   return self;
 }
@@ -119,7 +123,7 @@ - (void)URLSession:(__unused NSURLSession *)session
 
   BOOL completed = [reader readAllParts:^(NSDictionary *headers, NSData *content, BOOL done) {
     partHandler(statusCode, headers, content, nil, done);
-  }];
+  } progressCallback:_progressHandler];
   if (!completed) {
     partHandler(statusCode, nil, nil, [NSError errorWithDomain:NSURLErrorDomain code:NSURLErrorCancelled userInfo:nil], YES);
   }

React/Base/RCTMultipartStreamReader.h

@@ -10,13 +10,14 @@
 #import <Foundation/Foundation.h>
 
 typedef void (^RCTMultipartCallback)(NSDictionary *headers, NSData *content, BOOL done);
+typedef void (^RCTMultipartProgressCallback)(NSDictionary *headers, NSNumber *loaded, NSNumber *total);
 
 
 // RCTMultipartStreamReader can be used to parse responses with Content-Type: multipart/mixed
 // See https://www.w3.org/Protocols/rfc1341/7_2_Multipart.html
 @interface RCTMultipartStreamReader : NSObject
 
 - (instancetype)initWithInputStream:(NSInputStream *)stream boundary:(NSString *)boundary;
-- (BOOL)readAllParts:(RCTMultipartCallback)callback;
+- (BOOL)readAllParts:(RCTMultipartCallback)callback progressCallback:(RCTMultipartProgressCallback)progressCallback;
 
 @end

React/Base/RCTMultipartStreamReader.m

@@ -9,18 +9,22 @@
 
 #import "RCTMultipartStreamReader.h"
 
+#import <QuartzCore/CAAnimation.h>
+
 #define CRLF @"\r\n"
 
 @implementation RCTMultipartStreamReader {
   __strong NSInputStream *_stream;
   __strong NSString *_boundary;
+  CFTimeInterval _lastDownloadProgress;
 }
 
 - (instancetype)initWithInputStream:(NSInputStream *)stream boundary:(NSString *)boundary
 {
   if (self = [super init]) {
     _stream = stream;
     _boundary = boundary;
+    _lastDownloadProgress = CACurrentMediaTime();
   }
   return self;
 }
@@ -42,12 +46,17 @@ - (NSDictionary *)parseHeaders:(NSData *)data
   return headers;
 }
 
-- (void)emitChunk:(NSData *)data callback:(RCTMultipartCallback)callback done:(BOOL)done
+- (void)emitChunk:(NSData *)data headers:(NSDictionary *)headers callback:(RCTMultipartCallback)callback done:(BOOL)done
 {
   NSData *marker = [CRLF CRLF dataUsingEncoding:NSUTF8StringEncoding];
   NSRange range = [data rangeOfData:marker options:0 range:NSMakeRange(0, data.length)];
   if (range.location == NSNotFound) {
     callback(nil, data, done);
+  } else if (headers != nil) {
+    // If headers were parsed already just use that to avoid doing it twice.
+    NSInteger bodyStart = range.location + marker.length;
+    NSData *bodyData = [data subdataWithRange:NSMakeRange(bodyStart, data.length - bodyStart)];
+    callback(headers, bodyData, done);
   } else {
     NSData *headersData = [data subdataWithRange:NSMakeRange(0, range.location)];
     NSInteger bodyStart = range.location + marker.length;
@@ -56,14 +65,34 @@ - (void)emitChunk:(NSData *)data callback:(RCTMultipartCallback)callback done:(B
   }
 }
 
-- (BOOL)readAllParts:(RCTMultipartCallback)callback
+- (void)emitProgress:(NSDictionary *)headers
+       contentLength:(NSUInteger)contentLength
+               final:(BOOL)final
+            callback:(RCTMultipartProgressCallback)callback
+{
+  if (headers == nil) {
+    return;
+  }
+  // Throttle progress events so we don't send more that around 60 per second.
+  CFTimeInterval currentTime = CACurrentMediaTime();
+
+  NSUInteger headersContentLength = headers[@"Content-Length"] != nil ? [headers[@"Content-Length"] unsignedIntValue] : 0;
+  if (callback && (currentTime - _lastDownloadProgress > 0.016 || final)) {
+    _lastDownloadProgress = currentTime;
+    callback(headers, @(headersContentLength), @(contentLength));
+  }
+}
+
+- (BOOL)readAllParts:(RCTMultipartCallback)callback progressCallback:(RCTMultipartProgressCallback)progressCallback
 {
   NSInteger chunkStart = 0;
   NSInteger bytesSeen = 0;
 
   NSData *delimiter = [[NSString stringWithFormat:@"%@--%@%@", CRLF, _boundary, CRLF] dataUsingEncoding:NSUTF8StringEncoding];
   NSData *closeDelimiter = [[NSString stringWithFormat:@"%@--%@--%@", CRLF, _boundary, CRLF] dataUsingEncoding:NSUTF8StringEncoding];
   NSMutableData *content = [[NSMutableData alloc] initWithCapacity:1];
+  NSDictionary *currentHeaders = nil;
+  NSUInteger currentHeadersLength = 0;
 
   const NSUInteger bufferLen = 4 * 1024;
   uint8_t buffer[bufferLen];
@@ -75,13 +104,32 @@ - (BOOL)readAllParts:(RCTMultipartCallback)callback
     // to allow for the edge case when the delimiter is cut by read call
     NSInteger searchStart = MAX(bytesSeen - (NSInteger)closeDelimiter.length, chunkStart);
     NSRange remainingBufferRange = NSMakeRange(searchStart, content.length - searchStart);
+
+    // Check for delimiters.
     NSRange range = [content rangeOfData:delimiter options:0 range:remainingBufferRange];
     if (range.location == NSNotFound) {
       isCloseDelimiter = YES;
       range = [content rangeOfData:closeDelimiter options:0 range:remainingBufferRange];
     }
 
     if (range.location == NSNotFound) {
+      if (currentHeaders == nil) {
+        // Check for the headers delimiter.
+        NSData *headersMarker = [CRLF CRLF dataUsingEncoding:NSUTF8StringEncoding];
+        NSRange headersRange = [content rangeOfData:headersMarker options:0 range:remainingBufferRange];
+        if (headersRange.location != NSNotFound) {
+          NSData *headersData = [content subdataWithRange:NSMakeRange(chunkStart, headersRange.location - chunkStart)];
+          currentHeadersLength = headersData.length;
+          currentHeaders = [self parseHeaders:headersData];
+        }
+      } else {
+        // When headers are loaded start sending progress callbacks.
+        [self emitProgress:currentHeaders
+             contentLength:content.length - currentHeadersLength
+                     final:NO
+                  callback:progressCallback];
+      }
+
       bytesSeen = content.length;
       NSInteger bytesRead = [_stream read:buffer maxLength:bufferLen];
       if (bytesRead <= 0 || _stream.streamError) {
@@ -98,7 +146,13 @@ - (BOOL)readAllParts:(RCTMultipartCallback)callback
     // Ignore preamble
     if (chunkStart > 0) {
       NSData *chunk = [content subdataWithRange:NSMakeRange(chunkStart, length)];
-      [self emitChunk:chunk callback:callback done:isCloseDelimiter];
+      [self emitProgress:currentHeaders
+           contentLength:chunk.length - currentHeadersLength
+                   final:YES
+                callback:progressCallback];
+      [self emitChunk:chunk headers:currentHeaders callback:callback done:isCloseDelimiter];
+      currentHeaders = nil;
+      currentHeadersLength = 0;
     }
 
     if (isCloseDelimiter) {