This is how camping gets digitalized

Campsy is a portal where users can view more than two thousand camping sites and filter out the best offer for them. Most users book when they are already on the road and thus use their smartphone for it. To reach an optimized mobile site, Campsy has participated in the Google PageSpeed Race 2017 and did very well.

At Campsy, users can filter over two thousand offers by type of camping, location and price, browse photos and reviews, and finally conform their booking. The portals target groups are families, older couples or groups of friends. But there is one thing they have in common: They often search for campsites when they are already on the road. The majority of the bookings on Campsy are accordingly done via smartphone, says Phillip Hildebrand, CEO and founder of Campsy. “Mobile is therefore very important for us”. A fast and easy user experience even in slow network environments is thus essential for Campsy. This includes an optimized mobile website.

Improved performance by participating in the Google PageSpeed Race

For Campsy, the PageSpeed Race was a good opportunity to work on their site’s performance. The PageSpeed Race is a two-month competition in which 45 companies in Germany have been working on the optimization of their websites and have been given technical advice by Google experts. The three URLs, start, category, and product details pages were selected. For this purpose, the participants improved their page using Google’s PageSpeed Insights, which is based on a series of best practice checks and measures the performance of a page on mobile devices and desktop computers.

To do this, the URL is retrieved once with a mobile user agent and a second time with a desktop user agent. The PageSpeed rating is then determined on a scale of 0 to 100 points. A powerful page has a score of 85 or more. PageSpeed Insight shows the possibilities of increasing the performance of a page with regard to the time required to load the content that is visible without scrolling, and the time required to fully load the page.

The reasons for participating in the PageSpeed Race were multifaceted: “Of course, user experience is very important. However, this also means that the site speed is very important for our supply chain management”, says Hillenbrand. In particular, the degree of optimization of the page was expandable and had only 23 of 100 points at first. The loading time at the start of the competition was over 9 seconds. Therefore, the entire website has been updated as part of  the quarterly planning.

Image optimization, CSS and prerendering JavaScripts for more speed

During the analysis, the Campsy team found that the main problems in the frontend came from the images as well as the loading of the JavaScripts and the CSS files because they blocked the speed and scripts. To remedy this, Campsy used various optimization levers proposed by PageSpeed Insights. While initially optimizing the backend, the next steps were improving server response times and browser caching, optimize the images, and improve the visually visible part of the start, category and product detail pages. In addition to optimizing the CSS deployment, the prerendering of the JavaScripts proved to be an important measure. This is the preloading of a resource into the cache of a browser. 

The advantage is that the resource is loaded in the background without the user noticing it. When a user retrieves a referenced web page, it is displayed almost immediately because it has already been rendered before. “To optimize the images, we used a tool called Cloudinary. The tool has taken over the task of cropping and scaling the images”, says Levi Ferreira.

Reduction of loading time by 58%

“It was a known problem that our website had to be faster. The Google PageSpeed Race gave us the motivation to assert ourselves against other participants and prioritize this problem on our list”, says Amaryllis Liampoti, who is responsible for Marketing at Campsy. Levi Ferreira, Director of Engineering added, “For us, a well-performing website was also at the top of our list. However, of course we also have to look after the continuous improvement of the product thus we gave this project a lower priorization. Instead of moving our plans to the next month again and again, the Google PageSpeed Race gave us the impetus to say ‘Ok, we’ll make it – and we have done that.'”