The image loaded in this recipe was shared in 25 pieces. When there's no HTTP/2.0 available, the server will wait for 25 requests made by img src (from HTML) and then reply to each one of them with the proper image.
With HTTP/2.0, the server can push them all beforehand. The "magic" is done here:
PushBuilder pb = request.newPushBuilder();
if (pb != null) {
for(int row=0; row < 5; row++){
for(int col=0; col < 8; col++){
pb.path("image/keyboard_buttons/keyboard_buttons-"
+ row + "-" + col + ".jpeg")
.addHeader("content-type", "image/jpeg")
.push();
}
}
}
To check if your images are loaded using Server Push or not, open the developer console of your browser, go to network monitoring, and then load the page. One of the pieces of information about each image should be who sent it to the browser. If there's something like Push or ServerPush, you are using it!