Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show bundle download progress on iOS #15066

Closed

Conversation

janicduplessis
Copy link
Contributor

@janicduplessis janicduplessis commented Jul 17, 2017

This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

img_05070155d2cc-1

Test plan
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.

@janicduplessis janicduplessis added the Platform: iOS iOS applications. label Jul 17, 2017
@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. GH Review: review-needed Import Started This pull request has been imported. This does not imply the PR has been approved. labels Jul 17, 2017
@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

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;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we convert to kilobytes here?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Mostly just to make the numbers smaller, we don't really have a way to show units with the current setup so it's no really clear what the numbers are anyway.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why we don't make them smaller right before displaying them?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is as close as we get to displaying them, this is also used for showing the packager module transform progress so it just takes a progress number and the total then formats it to something like "10% (10/100)".

@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

@pull-bot
Copy link

pull-bot commented Jul 25, 2017

This PR has been submitted by a core contributor.

Attention: @shergin, @javache

Generated by 🚫 dangerJS

@facebook-github-bot facebook-github-bot added Import Failed and removed Import Started This pull request has been imported. This does not imply the PR has been approved. labels Jul 26, 2017
@janicduplessis
Copy link
Contributor Author

@shergin Could you check why this didn't import

@facebook-github-bot facebook-github-bot added the Import Started This pull request has been imported. This does not imply the PR has been approved. label Aug 3, 2017
@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

@shergin
Copy link
Contributor

shergin commented Aug 6, 2017

@janicduplessis This strange but one of our internal builds failes with this error:

Libraries/FBReactKit/js/react-native-github/React/Base/RCTMultipartDataTask.h:14:81: error: pointer is missing a nullability type specifier (_Nonnull, _Nullable, or _Null_unspecified) [-Werror,-Wnullability-completeness]

Do you have any idea? Seems this diff even don't modifies this line.

@janicduplessis
Copy link
Contributor Author

janicduplessis commented Aug 10, 2017

@shergin Fixed the error. I just removed the nullability specifier since we didn't use any in that file to begin with. Weird that the error was surfacing at the wrong place :o

Seems like this is new warning that can be enabled in xcode 9. Didn't update the projects to enable it for now but we might want to do that in the future when xcode 9 is released and update the projects to the new defaults.

@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

Copy link
Contributor

@shergin shergin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This awesome PR breaks RCTMultipartStreamReaderTests, unfortunately.

}
}

- (BOOL)readAllParts:(RCTMultipartCallback)callback progressCallback:(RCTMultipartProgressCallback)progressCallback
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we changed the signature of this method, may be we can name it a bit better including callback word into this? Something like readAllPartsWithCallback:progressCallback: or something even better?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe "CompletionCallback" so it's clear how it's different from the progress callback?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oups forgot to update the signature in tests, also updated it to readAllPartsWithCompletionCallback:progressCallback:. Should land this time!

@facebook-github-bot
Copy link
Contributor

@shergin has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

ide pushed a commit that referenced this pull request Aug 16, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes #15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
ide pushed a commit to expo/react-native that referenced this pull request Sep 5, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes facebook#15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
ide pushed a commit to expo/react-native that referenced this pull request Sep 7, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes facebook#15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
rozele pushed a commit to microsoft/react-native-windows that referenced this pull request Sep 11, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes facebook/react-native#15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
ide pushed a commit to expo/react-native that referenced this pull request Sep 11, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes facebook#15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
ide pushed a commit to expo/react-native that referenced this pull request Sep 19, 2017
Summary:
This shows progress for the download of the JS bundle (different from the packager transform progress that we show already). This is useful especially when loading the JS bundle from a remote source or when developing on device (on simulator + localhost it pretty much just downloads instantly). This will be nice for the expo client since all bundles are loaded over the network and can take several seconds to load.

This depends on facebook/metro#28 to work but won't crash or anything without it, it just won't show the progress percentage.

![img_05070155d2cc-1](https://user-images.githubusercontent.com/2677334/28293828-2c08d974-6b24-11e7-9334-e106ef3326d9.jpeg)

**Test plan**
Tested that bundle download progress is shown properly in RNTester on both localhost + simulator and on real device with network conditionner to simulate a slow loading bundle.

Tested that it doesn't cause issues if the packager doesn't send the Content-Length header.
Closes facebook#15066

Differential Revision: D5449073

Pulled By: shergin

fbshipit-source-id: 43a8fb559393bbdc04f77916500e21898695bac5
facebook-github-bot pushed a commit that referenced this pull request Feb 14, 2018
Summary:
Android equivalent of #15066

Tested that download progress shows up properly when reloading the app.

[ANDROID] [FEATURE] [DevSupport] - Show bundle download progress on Android
Closes #17809

Differential Revision: D6982823

Pulled By: hramos

fbshipit-source-id: da01e42b8ebb1c603f4407f6bafd68e0b6b3ecba
ide pushed a commit that referenced this pull request Feb 15, 2018
Summary:
Android equivalent of #15066

Tested that download progress shows up properly when reloading the app.

[ANDROID] [FEATURE] [DevSupport] - Show bundle download progress on Android
Closes #17809

Differential Revision: D6982823

Pulled By: hramos

fbshipit-source-id: da01e42b8ebb1c603f4407f6bafd68e0b6b3ecba
Plo4ox pushed a commit to Plo4ox/react-native that referenced this pull request Feb 17, 2018
Summary:
Android equivalent of facebook#15066

Tested that download progress shows up properly when reloading the app.

[ANDROID] [FEATURE] [DevSupport] - Show bundle download progress on Android
Closes facebook#17809

Differential Revision: D6982823

Pulled By: hramos

fbshipit-source-id: da01e42b8ebb1c603f4407f6bafd68e0b6b3ecba
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. Import Started This pull request has been imported. This does not imply the PR has been approved. Platform: iOS iOS applications.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants