einfachbacken.de Multisite
Publishing / Media
Winner
Case description
einfachbacken.de was designed as a mobile first project and implemented using Thunder, an installation profile for the Drupal 8 content management system (cms). Thunder is a publishing distribution optimized for the media and publishing industries."Einfach backen" is all about baking. Equipped with a large kitchen, baking pros Anna-Lena and Siggi test new creations. For the publication of the recipes, einfachbacke.de was created as the first website of a high-performance muli-site instance. Using this basis, a total of five websites were implemented:
• einfach backen www.einfachbacken.de
• mein schönes Land www.mein-schoenes-land.de
• slowly veggie www.slowlyveggie.de
• meine Familie & Ich www.meine-familie-und-ich.de
• beebetter www.beebetter.de
Case goals and results
The backend setup (nodes, paragraphs, forms, lists, ...) was adapted to the wishes and needs of the editors. Editorial and marketing workflows were also optimized.Technology decisions could also be based on results from sitespeed testing. As such, the decision was made to remove Jquery from the front end and to use Vue.js. A fast search phrase suggestion mechanism could also be introduced so that searches were more efficient.
Throughout development much attention was also given to SEO optimization. Schematic meta tags from Schema.org and structured data from JSON + ld are also central to the site. Custom tokens with fallback logic were designed to keep the Facebook Share and Google Search results running at their best.
The frontend also provides a user-friendly reading experience with image sections where readers receive different images depending on the size of their mobile, tablet or normal computer device. Thanks to a robust lazy loading set-up, content and items above the fold are delivered first, with the rest of the page loaded in the background.
The first website went live in August of 2018 after 8 months of development.
Prior to launch, the einfachbacken.de website was filled with a large number of recipes. Due to the extensive testing strategy, the high expectations in the area of performance could be guaranteed. Sitepeed.io tests continue to analyze the page load speed after each code change. With each update, the developer also takes site performance into account.
Challenges
The team of einfachbacken.de wants to share delicious recipes and baking knowledge with the goal of becoming the number one website for hobby bakers. The website should be created according to the motto mobile first, with a focus on the optimization of load times and on the performance of mobile devices to achieve better SEO and thus a wider audience. From an economic point of view, cost savings should be achieved by implementing a multi-site installation.Community contributions
Due to the high quality expectations and with the support of our client, einfachbacken.de continues to contribute back to the Drupal community in the form of new Contrib modules as well as patching and improving upon the following Drupal.org projects:• https://www.drupal.org/project/cache_tools
• https://www.drupal.org/project/preserve_page_cache
• https://www.drupal.org/project/ad_entity/issues/2974510
• https://www.drupal.org/project/theme_breakpoints_js/issues/2974508
• https://www.drupal.org/project/extlink/issues/2955326
Contributions were also made to frontend components like:
• https://github.com/drunomics/vue-lupus-rating
• https://github.com/drunomics/vue-lupus-slider
Last but not least, a session on developing high performance thunder websites was presented at Drupal Europe in 2018: https://www.drupaleurope.org/session/building-high-performance-thunder-sites
Why should this case win the splash awards?
Thunder & Drupal form the basis for this mobile first optimized website, which quickly became a springboard for multiple websites of this multi-site project. When developing the project, drunomics focused on performance right from the start. This manifests itself in extras such as the integration of Vue.js, SOLR, Varnish, and the Cloudflare CDN. A sophisticated ensemble of Behat, Sitespeed and Visual Regression Test (VRT) test suites guaranteed that the site remained stable and usable to the readers. A pre-fetcher was also introduced so that caches are actively kept warm.We can also announce that this multi-site project received the Splash Award 2019 for the category Media in Austria and was presented as best Austrian project of the evening. The chairman of the jury, Rouven Volk, explained that their decision was based on the outstanding technical implementation of the project. For further information about the Splash Awards 2019, see http://www.splashawards.de/2019/Austria