Port takeoff imminent!
After two successive postponements, Porto finally welcomed the WordCamp Europe! The event took place over three days from 2 to 4 June and brought together more than 2,300 people from all over the world (not counting those who followed the event live via Youtube).
It was a special edition because it was 10 years of WordCamp Europe !
This year again the first day was dedicated to the contribution to the WordPress project, with 800 people who responded to the call, a record compared to previous editions.
The following two days were followed by lectures and workshops, prepared by 60 speakers.
Key conferences and workshops
As with each WordCamp, the quality of the speakers and the topics discussed were at the meeting.
We were able to extract some of the following strong elements.
Block patterns and Full Site Editing
Among the topics discussed, the Blocks Patterns and the Full Site Editing were clearly in the spotlight this year. If the conference on the pattern blocks was intended to play on the exciting aspect of this feature, the workshop on the construction of a FSE-ready theme allowed us to put our hands in the code and better understand this evolution of the creation of WordPress theme so the opportunities offered by this new approach.
The block pattern revolution (conference)
Speaker : Sean Blakeley
Description : https://europe.wordcamp.org/2022/session/the-block-pattern-revolution/
Replay : https://youtu.be/91anxAgQGJw?t=8713
There is nothing new in the block patterns (or compositions) in 2022. They are indeed present for 2 years already in the heart of WordPress, and the restitory of patterns, which makes it possible to pee in a highly provided library, is available since last year.
What changes, in reality, is rather the vision that one can have of this feature, it is true, a little underestimated when it comes out. It must be said that the ESF, and especially version 6.0 of WordPress, put them a little on top of the pile.
- Sean Blakeley recalls that the creation of a pattern is very simple, very fast, that it can now be done by any actor on the web, whatever his profession, and that it is very easy to share them. Blocks are Legos, patterns are constructions: we take and do what we want.
- Another strong argument that encourages the use of patterns: the webdesigner and the developer now have a common language. Webdesigner no longer controls the creation of graphic components. Patterns promote the collaboration and effectiveness of both trades. Indeed, thanks to the co-construction of patterns with the webdesigner, the developer can easily appropriate the graphic intentions of the webdesigner and build blocks and patterns in this direction.
- Finally, patterns give more meaning to the increase in the customer's skills, and to the appropriation of his site. In the relationship with the client, we then pass from the effect « impress us » (provider) to « working together ». The customer is thus more naturally embedded in the project and involved in managing its content.
The feeling at the end of this conference: we want to start a new project, to work with everyone, right away.
Build your first block theme (workshop)
Speaker : Daisy Olsen
Description : https://europe.wordcamp.org/2022/session/build-your-first-block-theme/
Replay : not available for workshops
The Full Site Editing (FSE) is very recent (late 2021), it is phase 2 of the Gutenberg project. This new evolution has a very important scope on how we work with WordPress since it will change in depth how to create, modify, maintain the themes.
Through his 2-hour workshop, Daisy Olsen made us enter smoothly into the creation of an ESF-ready theme by simply answering the following questions:
If this new way of working seems at first rather confusing (or even complex), the negative impression is completely inverse after 1h. We start to see it more clearly and, by taking a little step back, it becomes much easier to project on the practical implementation and use of the ESF.
What we will remember is that with the ESF, everything is possible in terms of publishing in the back office. It's good news, but it's also an issue for agencies. This issue will be very precisely about the settings (personalization, user authorizations, block/pattern locking) and specific editor to allow content contributors to have a personalized, intuitive and efficient editing interface.
Just like Gutenberg when he comes out, it's going to be necessary to own the ESF on all sides of a project, but there's no doubt that we'll end up coming out happy on all sides, both technically (themed creation), and editorially (content editing).
Performance
The real impact of having website performance as a mindset (conference)
Speaker : Leo Postovue
Description : https://europe.wordcamp.org/2022/session/migrating-wordpress-core-to-github-actions-a-retrospective/
Replay : https://youtu.be/0GiB99rkivI?t=4809
The conference plunges us directly into the topic: "What is performance as a state of mind and how to access it".
Performance can be seen from different angles. Technically, we can measure the loading time of a page. On the customer side we can measure the number of clicks on an advertisement, or the drop-out rate on the forms/questionnaires.
This performance is not frozen in time and will vary during the life of a site. It is therefore not only necessary to collect measurements at an instant T, but also to be able to keep them in order to compare them. With a view to continuous improvement, it is necessary to have a starting point to make our action visible.
Today it is easy to collect performance measures using several tools. It is recognised that performance has a direct impact on users, e.g. a second additional loading time has an increase in the drop-out rate on a site of 26%.
It should be noted that the opposite is equally valid, our efforts are rewarded. The example was given with "Australian Geographic", their content is of very good quality, however the speed of the site is not good, all the other metrics are influenced. The optimization of the site made it possible to make: more purchases, more subscribers, more advertising views etc. It is a virtuous circle, improving the performance of the site, all the other elements of the site have been impacted.
There are 4 pillars of the WEB performance on which we can act:
- Page speed
- User experience
- Conversion
- Detention
The most important pillar within our reach and with significant effects for everyone is the speed of loading pages.
It can be measured very easily using tools such as:
- Pagespeed insights
- New Relic
- CalibreApp
- etc.
The aim is to measure the speed of our site often and in real conditions.
These data will then enable action to be taken on the points of difficulty as simply as possible.
For example, if when you visit your website banners, popups, inserts appear, the score of CLS (cumulative layout shift) will be very bad and no one will want to continue browsing the site. Google has published an article about the effects of web perf on business and it can be said that a fast site allows a person to be held on its site longer.
In some areas, people can come about ten times to the site before making the decision to buy or not a product or service, if the experience is good then the conversion rate will be good.
Another example was given with the redesign for the Australian "Telethon" event, where the donation rate increased by 30% with good performance and user experience on small onions.
The other pillars are more difficult to measure because they are site specific. But succeeding in making visitors do what they wanted them to do is a victory. Bring them back to the site, another one. Having a home page full of information is not necessarily useful, cutting information allows you to have less heavy and more efficient sites.
What we will remember is that measuring performance is a long-term goal, acting proactively to achieve the best possible performance will increase the satisfaction of your visitors and ROI.
Optimization strategies for the Paint Web Vitals (workshop)
Speaker : Mike Crantea
Description : https://europe.wordcamp.org/2022/session/performance-optimization-strategies-for-improving-the-paint-web-vitals/
Replay : not available for workshops
The workshop focused on improving the performance of an existing web page. The speaker presented his method of acting on page performance directly from his browser through a convenient Chrome feature: Replacement.
It is possible from Chrome to enable modification of received pages from the console. The principle is to download a web page locally and allow us to gradually modify elements of it to measure the impact on performance without having access to the website in question.
During the workshop, we were able to simulate unfavourable page loading conditions in order to highlight performance problems and launch a lighthouse test in mobile mode:
- On a 4G motorola and reduced viewport
- On a 3G fast connection
The test result gives us the vital web cores of the web page without modification:
- FCP: indicates when the first text or image is displayed.
- TTI: is the time required for the page to become fully interactive.
- TBT: sum in milliseconds of all periods between the First Contentful Paint and Time to Interactive, when the duration of the task exceeded 50 ms.
- CLS: measures the movement of visible elements in the display window.
- LCP: indicates when the longest text or larger image is displayed
In our test we were able to identify the following points:
- Blocking styles
- Blocking scripts
- The fonts charged
- The interlocked execution chains
- The LCP that slows down the page
Once these elements were isolated, we gradually improved performance by:
- Preloading critical fonts, styles and scripts in headers
- Preloading the LCP main image of the site
- Changing the loading of secondary styles into non-blockers
- Changing the loading of scripts in defer
- Adding decoding attributes images for the browser
Preloading content lets you tell the browser what resources it will need before it even meets them. The browsers can start downloading these resources in parallel with loading the page.
What we can remember from this workshop is that the speaker offered us an empirical method with Lighthouse. We test, we detect a blocking element, we try to correct it, we test again and we do it again. Web performance is not an exact science but you can quickly get results!
This is a practice that we will use heavily in our Be API performance audits so we can present optimizations without waiting to arrive in production to measure impacts.
Sponsors, organizers and speakers
The WordCamp Europe cannot take place without the participation of sponsors, volunteer organizers and all speakers.
They allow the whole community to meet to exchange on our common WordPress tool.
We would like to thank them very much for the work done in organizing these 3 days of madness.
...and next year in Athens
We hope to meet you next year from 8 to 10 June in Athens for The 2023 edition of WordCamp Europe.
