[$500] [HOLD for payment 2023-11-21] [Tracking] Start using DotLottie animation assets instead of lottie JSON

[roryabraham]

Problem

We are scaling up our use of lottie animations across our app. However, lottie JSON files are large and heavy. For example, we've seen performance issues with the lounge page animation, which is about 4Mb.

Solution

Let's adopt the new dotlottie file format for our lottie animations to save on bundle size, make animations load faster on web, and make them more lightweight to run. It's likely that the new file format will result in files about 10% the size of the current ones.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01177ccd6f38fa029b
• Upwork Job ID: 1729581933567508480
• Last Price Increase: 2023-11-28

Issue Owner

Current Issue Owner: @mananjadhav

[roryabraham]

Fortunately lottie-react-native now supports dotlottie 🎉

The next step is to just get our web implementation in place. Posted about this in slack here

[roryabraham]

#26871

[roryabraham]

Pinged for updates in #26871

[roryabraham]

@kosmydel has a draft PR against the upstream but is OOO this week. I'm also working with Emilio and Matin to make sure they're paid for their work in lottie-react-native for iOS and Android

[roryabraham]

Pinged for an update in the lottie web task. Working on paying lottie-react-native maintainers for their work in adding DotLottie support.

[roryabraham]

Web support PR was approved three days ago

[roryabraham]

I see there's a draft PR, left a review on it to request that we first implement web support for lottie in one PR, then follow up with another to switch to .lottie files

[melvin-bot]

@roryabraham Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot]

@roryabraham 6 days overdue. This is scarier than being forced to listen to Vogon poetry!

[roryabraham]

This is done but we need to make a C+ payment to @mananjadhav, marking as New Feature to move arrange that.

[melvin-bot]

Triggered auto assignment to @NicMendonca (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01177ccd6f38fa029b

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @thesahindia (External)

[melvin-bot]

📣 @mananjadhav Please request via NewDot manual requests for the Contributor Contributor+ role ($500)

[AndriyKas]

Actually, yes, DotLottie player should help you, but not 100%.
There is a high probability that the person who created this Lottie file optimized it in the program in which they created it.
Let me just take a look at what your files look like and what file size they have

I am a motion designer with a skill in web development and have already solved about 10 similar problems related to lottie optimization

[melvin-bot]

📣 @AndriyKas! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[mananjadhav]

I've raised a request on NewDot for the same.

[NicMendonca]

BZ summary:

• reporter: n/a
• contributor: n/a
• contributor +: @mananjadhav - $500

[JmillsExpensify]

$500 payment approved for @mananjadhav based on summary above.