question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Optimize the lib ColorThief

See original GitHub issue

Collapse will use the method in ColorThief to calculate the theme color of the background image when switching game region. But the performance of this third-party library is extremely bad. It takes 169 ms when parsing the official launcher image (1280x730), and only more when parsing custom larger images.

Get palette list with colorCount=255 and quality=3, Same parameters as collapse.

Ignore the time consumption and memory allocation for image decoding

image

ColorThief can be optimized as follows:

  • Use pointer to get pixels with color instead of Bitmap.GetPixel
  • Use one-dimensional arrays byte[] to store pixels instead of interleaved arrays byte[][]
  • Directly specify the number of pixels when splitting the vbox, instead of repeated calculations

After I optimized the code, the time consumed and the amount of memory allocated were greatly reduced. To make it simpler to write the code, each pixel of the image will be included, so the parameters: colorCount=255 and quality=1.

image image

Could I remove the submodule ColorThief and commit code in this project?

Issue Analytics

  • State:closed
  • Created 4 months ago
  • Comments:7 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
neon-nyancommented, Jun 2, 2023

Hi @Scighost,

Thank you for the information. As per your suggestion and some additional changes including:

  • Enumerate the pixel (only took R, G and B channel) into a single int.
  • Pass the IEnumerable<int> into Mmcq.Quantize() and processing the pixels on-the-fly.

By enumerating the pixel directly instead of pre-allocating it first with this “v2” code, we got a really significant reduction memory allocation from initially 352 MB to 21.65 MB at “v1” changes and finally 130 KB at “v2” changes with quality=1

Method Mean Error StdDev Ratio Allocated Alloc Ratio
GetPalleteOldQuality8 458.494 ms 7.2605 ms 6.7915 ms 0.121 44205.29 KB 0.125
GetPalleteOldQuality4 918.912 ms 7.1911 ms 6.7266 ms 0.243 88262.94 KB 0.250
GetPalleteOldQuality2 1,870.017 ms 11.8865 ms 11.1187 ms 0.495 176398.48 KB 0.500
GetPalleteOldQuality1 3,781.903 ms 13.0441 ms 10.8924 ms 1.000 352658.34 KB 1.000
GetPalleteNewAndFixQuality8 1.593 ms 0.0163 ms 0.0153 ms 0.000 130.38 KB 0.000
GetPalleteNewAndFixQuality4 4.799 ms 0.0285 ms 0.0253 ms 0.001 130.38 KB 0.000
GetPalleteNewAndFixQuality2 17.884 ms 0.2137 ms 0.1999 ms 0.005 130.4 KB 0.000
GetPalleteNewAndFixQuality1 71.567 ms 0.8822 ms 0.8252 ms 0.019 130.45 KB 0.000

Note

The quality=1 on this new “v2” code has a bit performance degradation compared to the last modification due to enumeration overhead. But the rest with quality > 1 got a bit performance improvement. Hope this can be improved in the future.

That being said, thank you for your amazing contribution on this optimization! Please allow me to merge the changes into ColorThief Submodule repo and close this issue.

YattaBoom

1reaction
Scighostcommented, May 30, 2023

Good job!

There are two more small areas that can be optimized.

  • Initialize the color vector space directly from the image’s memory area, skipping the step of passing pixel values using byte arrays.
  • After setting quality, only pixels in the x-direction are currently sampled, and pixels in the y-direction should be sampled as well.

Of course, it is very good now, and I will not pull request for ColorThief again.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to optimize a palette-based image recoloring algorithm
I'm done, and it's working, but I need your help on optimizing its results and time. The code to generate the palette using...
Read more >
Color Thief
Getting started. The Color Thief package includes multiple distribution files to support different environments and build processes. Here is the list of all ......
Read more >
Dominant color with color-thief.js
This gist extracts the dominant color of an image using the Javascript color-thief library. By refreshing the gist an image is randomly picked...
Read more >
color-thief CDN by jsDelivr - A CDN for npm and GitHub
A free, fast, and reliable CDN for color-thief. A script for grabbing the color palette from an image. Uses Javascript and the canvas...
Read more >
Color-thief example
Maximize HTML Editor; Minimize HTML Editor; Fold All; Unfold All. xxxxxxxxxx. 9. 1. <div id="top">. 2. <img height="80%" crossorigin="anonymous" ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found