I have updated my GitHub repository
Katalon Studio equips several built-in keywords that take screenshot of web pages (such as WebUI.takeFullPageScreenshotAsCheckpoint()). All of them save images into PNG format. Sometimes the created PNG file is very large (say, 6M bytes). Large files are difficult to manage and utilize. I have updated my ashotwrapper to enable saving screenshots in JPEG format while specifying compression quality of [0.1f, 1.0f].
I have done developping the library, and published the jar at the Releases page. Have a look at the doc.
In the doc, there is a section titled “Study how to reduce file size of screenshots using JPEG format”. I would quote that section here, as I believe it would be a interesting read for you, katalon users in general.
Selenium WebDriver supports taking screenshot of the browser window. See tutorials. WebDriver produces files always in PNG format. Sometimes, screenshots in PNG format can be very large in byte size. For example, this PNG file is as large as 6.5 Mega bytes. If you are going to take many screenshots in your testing project, the size of screenshot images matters. Large image files are difficult to manage and utilize. So I want to make the screenshot image files as small as possible. But how to?
I found some libraries that compress a PNG file into another PNG file of smaller size, for example Pngquant. But I do not like to depend on those external libraries. I want a solution that I can use on top of Java8. A well-know resolution is to save screenshots in JPEG, not PNG, while specifying compression quality.
In theory, the smaller the compression quality is, we can expect the resulting JPEG file will have smaller size at the cost of poorer quality of image view.
Practically, how large the screenshots of web pages will be in PNG, in JPEG with 1.0f, 0.9f, … , 0.1f? Different design of web pages may result different file sizes. My ultimate question is, given a URL to take screenshot, which format should I use: PNG or JPEG? If I choose JPEG, then what value of compression quality should I specify?
In order to answer to the question, I have created a JUnit5 test, named FileSizeTest. This test targets 3 public URL, take screenshots in PNG and JPEG with varying compression quality; the test compiles tables where you can find how large in % each JPEG files are against the baseline PNG file.
Web page with lots of photos
A web page that is composed of lots of eye-catching photos
| File | Quality | Size(bytes) | % to PNG |
|---|---|---|---|
1.0 |
6,588,545 |
100% |
|
1.0 |
3,041,837 |
47% |
|
0.9 |
1,187,056 |
19% |
|
0.8 |
843,636 |
13% |
|
0.7 |
692,684 |
11% |
|
0.6 |
595,758 |
10% |
|
0.5 |
531,487 |
9% |
|
0.4 |
469,988 |
8% |
|
0.3 |
404,645 |
7% |
|
0.2 |
324,059 |
5% |
|
0.1 |
223,726 |
4% |
Photo-rich page results in the screenshots of very large size. PNG is surprisingly lager than JPEG of the compression quality 1.0. PNG is not suitable for photo-rich pages. You should save the screenshots of photo-rich pages in JPEG, seriously.
Text-only web page
Text-rich page without eye-catching photos
| File | Quality | Size(bytes) | % to PNG |
|---|---|---|---|
1.0 |
295,798 |
100% |
|
1.0 |
569,674 |
192% |
|
0.9 |
280,978 |
95% |
|
0.8 |
214,878 |
73% |
|
0.7 |
182,895 |
62% |
|
0.6 |
161,678 |
55% |
|
0.5 |
146,857 |
50% |
|
0.4 |
133,145 |
46% |
|
0.3 |
117,464 |
40% |
|
0.2 |
98,488 |
34% |
|
0.1 |
73,360 |
25% |
Text-rich page results in the screenshots of small size. PNG is smaller than JPEG of the compression quality 1.0. PNG is suitable for text-rich pages.
Ordinary web page with text and a few images
Mixture of texts and small number of images. There are a lot of web sites on the net like this.
| File | Quality | Size(bytes) | % to PNG |
|---|---|---|---|
1.0 |
582,684 |
100% |
|
1.0 |
1,288,390 |
221% |
|
0.9 |
562,293 |
97% |
|
0.8 |
410,043 |
71% |
|
0.7 |
340,999 |
59% |
|
0.6 |
295,414 |
51% |
|
0.5 |
264,916 |
46% |
|
0.4 |
236,851 |
41% |
|
0.3 |
206,214 |
36% |
|
0.2 |
169,583 |
30% |
|
0.1 |
121,342 |
21% |
PNG has smaller file size than JPEG of the compression quality 1.0. The JPEG of compression quality 0.9f is quite similar to PNG. Yes, you can tune JPEG to be smaller than PNG but the benefit is not so much significant.