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

Downsample images before uploading them #2749

Open
borisyankov opened this issue Jul 1, 2018 · 1 comment
Open

Downsample images before uploading them #2749

borisyankov opened this issue Jul 1, 2018 · 1 comment
Labels
a-compose/send Compose box, autocomplete, camera/upload, outbox, sending

Comments

@borisyankov
Copy link
Contributor

If an image uploaded to the server is larger than some predetermined dimensions, downsample to that size. (we might want to offer an option to not downsample)

Considerations:

  • Instagram uses 1024x1024 images. This seems to work quite well in the majority of cases.
  • Phone pictures and screenshots can be 10-20x as big in pixel count / byte zie.
  • We can dramatically reduce upload and download speeds in most cases if we reduce size and increase compression levels
  • Our downsampling client-side should be more conservative (it is permanent per upload) than the thumbnailing on the server-side

We might experiment with 2048x2048 limit for client-side and 1024x1024 limit server-side (both configurable)

In this thread:
https://chat.zulip.org/#narrow/stream/9-issues/topic/IOS.20app.20emoji.20cutoff

I have demonstrated a 1.46mb mobile screen-shot still being very legible downsampled to 20kb.

armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Aug 14, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Aug 25, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Sep 10, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Sep 10, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Sep 27, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The installation is done by doing an yarn add followed by
react-native link. See full installation instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/master/README.md

IMPORTANT NOTE:
The extra maven packages and compileSDKVeresion and settings are required
as noted by the readme. There are also some special instructions for deploying
production version of the library.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Sep 28, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The installation is done by doing an yarn add followed by
react-native link. See full installation instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/master/README.md

IMPORTANT NOTE:
The extra maven packages and compileSDKVeresion and settings are required
as noted by the readme. There are also some special instructions for deploying
production version of the library.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Oct 3, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The installation is done by doing an yarn add followed by
react-native link. See full installation instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/master/README.md

IMPORTANT NOTE:
The extra maven packages and compileSDKVeresion and settings are required
as noted by the readme. There are also some special instructions for deploying
production version of the library.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Oct 11, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The installation is done by doing a yarn add followed by
react-native link. See full installation instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/07d321e3bc279b0ad218817245264cda6a7c77cb/README.md

Old react-native-image-picker files have been removed by react-native unlink in combination
with looking at the commit that did the initial install and undoing those changes.

NOTE: we want to take care to read the "Production build" instructions in the Readme
while building the app for production.
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Oct 19, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The removal of react-native-image-picker was done by:
1) Removing dependency from yarn
2) Running react-native unlink react-native-image-picker
3) Checking the initial commit and removing any code that may
not be covered by unlink. For reference the initial commit that
introduced changes was 515436a.

The addition of react-native-image-crop-picker is done by following the installation
instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/07d321e3bc279b0ad218817245264cda6a7c77cb/README.md

This involved:
1) Adding the dependency via yarn
2) Running react-native link react-native-image-crop-picker
3) Adding the frameworks under embedded binaries as described by this comment
   ivpusic/react-native-image-crop-picker#61 (comment)
   and also under the "Manual" section of the PostInstall steps.

Note: We are ignoring a few of the PostInstall steps described in the Readme namely:

1) Changing the deployment target to 8.0 - We already have a higher target set.
2) The steps described in "To localizate the camera / gallery text buttons" -
   I dont believe this is required and the instructions seem vague.
3) Adding "useSupportLibrary" as described in a previous commit -
   This is required for cropping images and we don't have that feature enabled currently.
   When we enable that feature we will want to add this as well.

Note: We want to test this commit is working by archiving the project and uploading to
TestFlight.
@gnprice gnprice added the a-compose/send Compose box, autocomplete, camera/upload, outbox, sending label Nov 10, 2018
armaanahluwalia added a commit to armaanahluwalia/zulip-mobile that referenced this issue Dec 8, 2018
This commit replaces react-native-image-picker in favor of
react-native-image-crop-picker.

It solves a few key issues like being able to -
1) Select multiple images
2) Being able to downsample image quality.  See issue zulip#2749
3) Being able to scale down images.
4) Being faster at processing images.

The removal of react-native-image-picker was done by:
1) Removing dependency from yarn
2) Running react-native unlink react-native-image-picker
3) Checking the initial commit and removing any code that may
not be covered by unlink. For reference the initial commit that
introduced changes was 515436a.

The addition of react-native-image-crop-picker is done by following the installation
instructions at
https://github.com/ivpusic/react-native-image-crop-picker/blob/07d321e3bc279b0ad218817245264cda6a7c77cb/README.md

This involved:
1) Adding the dependency via yarn
2) Running react-native link react-native-image-crop-picker
3) Adding the frameworks under embedded binaries as described by this comment
   ivpusic/react-native-image-crop-picker#61 (comment)
   and also under the "Manual" section of the PostInstall steps.

Note: We are ignoring a few of the PostInstall steps described in the Readme namely:

1) Changing the deployment target to 8.0 - We already have a higher target set.
2) The steps described in "To localizate the camera / gallery text buttons" -
   I dont believe this is required and the instructions seem vague.
3) Adding "useSupportLibrary" as described in a previous commit -
   This is required for cropping images and we don't have that feature enabled currently.
   When we enable that feature we will want to add this as well.

Note: We want to test this commit is working by archiving the project and uploading to
TestFlight.
@alya
Copy link
Collaborator

alya commented Jan 17, 2023

Requested on CZO.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a-compose/send Compose box, autocomplete, camera/upload, outbox, sending
Projects
None yet
Development

No branches or pull requests

3 participants