Our Podcast
Siegfried, deploy!
Dominik and Steffen are long-term friends, the founders of Bleech – and total nerds when it comes to websites. Always having the user in mind they critically question the status quo in web development. By trying out the latest technologies they improve common approaches or develop new ones. Listen to them when they discuss current developments in web technologies and learn more about their tools, techniques and their philosophy.
Listen on
Featured Episode
Relaunching Websites: SEO Strategies for a Smooth Transition
Are you ready to level up your website relaunch game? We've got you covered with advice on search engine optimization, content migration, and promoting your strongest content while ditching the old, low-performing stuff.
We also tackle the nitty-gritty of optimizing URL structures and redirects for a seamless transition. You'll learn how a short URL base can work wonders and why preparing for potential future restructures is essential.
Finally, we share SEO housekeeping tips, explore the significance of having a well structured sitemap and discuss tracking 404 requests, core web vitals, and accessibility issues.
Highlights of the episode
00:00 Intro
00:36 Overview
01:13 Strategy #1: Content Migration
08:05 Strategy #2: Slugs
19:06 Strategy #3: Redirects
25:41 Strategy #4: Google Search Console
Links
Franz Enzenhofer's SEO book: https://www.fullstackoptimization.com/a/understanding-seo
Google Search Console: https://search.google.com/search-console
Redirection plugin: https://wordpress.org/plugins/redirection/
Yoast plugin: https://wordpress.org/plugins/wordpress-seo/
Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme Flynt
Bleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy!
Previous Episodes
28 Episodes
-
PGlmcmFtZSB0aXRsZT0iUmVsYXVuY2hpbmcgV2Vic2l0ZXM6IENvbnRlbnQgTWlncmF0aW9uIHRvIFdvcmRQcmVzcyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9lRlppQXdjay1GVT9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Relaunching Websites: Content Migration to WordPress
In today's episode Steffen and Dominik discuss the challenges of content migration when relaunching websites. Migrating structured content is relatively easier, while unstructured content poses more challenges. Strategies such as archiving, database views, scraping tools, and manual copying are possible approaches to content migration, with emphasis on optimizing and redesigning content during the process.
Highlights of the episode
00:00 Intro
00:59 Challenges & opportunities
03:43 When not to migrate
05:47 Keeping archives alive
08:02 Case #1: Scraping
11:29 Other methods
13:37 Importing text & metadata
16:39 Importing images
17:54 How complicated is it?
19:51 Case #2: Database views
27:13 Exporting content types
28:29 Case #3: WordPress to WordPress
30:17 Bonus topic: SEO strategies
Links
WP All Import: https://www.wpallimport.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iV29yZFByZXNzIGNvbnRlbnQgc3luY2hyb25pemF0aW9uIGFjcm9zcyBlbnZpcm9ubWVudHMiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQvYXpmaVptNFljSzg/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=WordPress content synchronization across environments
Join Steffen and Dominik as they dive deep into the world of WordPress content synchronization. Discover the best strategies and techniques to seamlessly migrate and synchronize your WordPress database and uploads across various environments, including local, development, staging, and production.
Highlights of the episode
00:00 Intro
01:13 Synch #1: to fix bugs
01:52 Synch #2: to launch websites
02:20 Synch #3: to collaborate in development
03:28 WordPress specialty: URLs in the database
07:34 Tools to synch content
10:47 Cloning from the dev server
18:35 Migrating from dev to production
22:26 Replacing URLs in the WP database
28:06 Synching from production to dev
30:43 Anonymizing personal data
33:05 How often we synch content
35:20 Database-less WordPress
Links
WP Migrate DB Pro: https://deliciousbrains.com/wp-migrate-db-pro/
Duplicator: https://duplicator.com/
ManageWP: https://managewp.com/
rsync: https://rsync.samba.org/
WP CLI: https://wp-cli.org/
faker library: https://fakerjs.dev/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iQWRkIGEgV29yZFByZXNzIEJsb2cgdG8gWW91ciBFeGlzdGluZyBXZWJzaXRlIiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL2hBWDBEcXRaakhrP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Add a WordPress Blog to Your Existing Website
In todays episode Steffen and Dominik explore different ways to integrate WordPress into existing websites, particularly for blogs, magazines, and landing pages. You'll learn about methods like integrator templates, reverse proxies and others.
Highlights of the episode
00:00 Intro
01:08 Method 1 – Integrator template
6:48 Method 2 – Reverse Proxy
09:46 Challenges with Reverse Proxies
14:05 Method 3 – Rebuilding
16:46 Method 4 – Module Federation
20:44 Method 5 – Content Only
25:39 Combine multiple approachesLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iSGVhZGxlc3MgV29yZFByZXNzIC0gU2hvdWxkIHlvdSB1c2UgaXQ/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL1lSX2c3Vkh2a25RP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Headless WordPress – Should you use it?
In this episode Steffen and Dominik are discussing headless and static WordPress, explaining the motivations behind using a static site generator over a traditional PHP server. While they acknowledge the hype around headless systems, they emphasizes that the need for static sites is often more important and that there are tools available, both WordPress-specific and general, to generate static sites.
Highlights of the episode
00:00 Intro
01:11 Static WordPress
03:50 Headless WordPress
06:16 Making a WordPress website static
09:46 Concept & advantages of a headless website
12:40 Data modeling in WordPress
16:11 Challenges with headless
18:55 Advantages of headless
33:38 Should you go headless?
Links
Andy Bell – The loud minority https://andy-bell.co.uk/the-extremely-loud-minority/
Headless CMS Contentful https://www.contentful.com/
Next.js https://nextjs.org/
Astro https://astro.build/
WP Engine Atlas https://wpengine.com/headless-wordpress/
Faust.js https://faustjs.org/
Flynt Starter Theme https://flyntwp.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iU2hvdWxkIHlvdSB1c2UgQ2xvdWRmbGFyZSAoQ0ROKSBvbiB5b3VyIHdlYnNpdGU/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL25wdzJ3OC1rMElrP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Should you use Cloudflare (CDN) on your website?
In today’s episode Steffen and Dominik are discussing content delivery networks (CDNs), with a focus on Cloudflare. CDNs are used to distribute static content to users more quickly and efficiently. However managing content on a CDN can be complicated, especially when it comes to caching and ensuring that content is consistent across different servers. In this episode you'll learn about some best practices for dealing with these issues.
Highlights of the episode
00:00 Intro
00:15 What is a CDN?
02:42 How to use a CDN
05:17 Pros and Cons of Push vs. Pull
08:16 Prevent inconsistent assets
14:10 Types of Caching
17:32 Full-Page Caching
18:51 What's special about Cloudflare
21:55 Does every website need a CDN?
25:12 GDPR compliance
27:53 Why we use Cloudflare
31:36 Pro tip
Links
https://www.cloudflare.com/
https://wordpress.org/plugins/wp-cloudflare-page-cache/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iV29yZFByZXNzIEhvc3RpbmcgZm9yIFByb2Zlc3Npb25hbHMgLSBXaGF0J3MgdGhlIGJlc3QgcHJvdmlkZXI/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL01lcmhxZ1NhR1Z3P2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+WordPress Hosting for Professionals – What’s the best provider?
In this episode Steffen and Dominik discuss different options for WordPress hosting, including dedicated WordPress hosting, managed PHP hosting, VPS or root server hosting. What are the pros and cons of each option? Learn what they recommend for those with high traffic WordPress websites or single instances.
Highlights of the episode:
00:00 Intro
00:39 Hosting Options Overview
03:16 Dedicated WordPress Hosting
11:26 Managed PHP Hosting
20:19 VPS / Root Server Hosting
28:38 Docker & Kubernetes Hosting
37:02 Other Hosting
42:57 Our Recommendations
47:35 Your ExperiencesLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iSW1wcm92ZSBMYXJnZXN0IENvbnRlbnRmdWwgUGFpbnQgKExDUCkgYW5kIFNwZWVkIHVwIHlvdXIgV29yZFByZXNzIFdlYnNpdGUiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQvVFJ5QzYtajN3djg/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=Improve Largest Contentful Paint (LCP) and Speed up your WordPress Website
Today Steffen and Dominik dive deep into the page speed factor of the Largest Contentful Paint (LCP). You'll learn how to optimize your website to achieve a fast LCP and which strategies work for flexible components. But with all the details, don't forget the basics of page speed optimization…
Highlights of the episode
00:00 Intro
00:10 What is LCP?
02:56 Typical largest elements
05:51 Reach fast LCP
09:03 How to handle video?
13:27 New Blackhat PageSpeed technique?
14:24 How to optimize LCP?
17:19 Strategies for flexible components
22:20 Font display strategy
28:42 First do the basics
32:52 Simplicity over Complexity
Links:
Optimize LCP: https://web.dev/optimize-lcp/
Flynt: https://flyntwp.com/
lazysizes: https://github.com/aFarkas/lazysizes
fetchpriority="high": https://www.smashingmagazine.com/2023/01/optimizing-image-element-lcp/
Best practices for fonts: https://web.dev/font-best-practices/
LCP font optimization: https://pixelpoint.io/blog/advanced-web-font-optimization-techniques/
Fontaine (font fallback generator): https://github.com/danielroe/fontaine
Fontpie (font fallback generator): https://github.com/pixel-point/fontpieLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iSG93IHRvIFNlY3VyZSBZb3VyIFdlYnNpdGUgZnJvbSBIYWNrZXJzPyAoV29yZFByZXNzIFNlY3VyaXR5KSIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC85bVVUbk1LSGdHZz9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==How to Secure Your Website from Hackers? (WordPress Security)
Is WordPress secure? We get asked this question over and over again. The answer: WordPress websites are just as secure or insecure as any other website. Because most of the time, mistakes in the absolute basics are the reason for a website being hacked. In this podcast episode, Steffen and Dominik discuss what the weak points of a WordPress website are and how you can protect yourself against a hack.
Highlights of the episode
00:00 Intro
00:20 Is WordPress secure?
02:52 Risk: Plugins and themes
08:14 Growing interest in WP security
09:54 Risk: Passwords
12:03 Plugin whitelist
12:43 Other measures to prevent hacking
14:22 Security plugins vs. infrastructure security
16:31 Important basics
17:19 Why external hosting service?
18:54 DoS attack of client website
21:00 „Random“ WordPress hacks
22:06 Prevent saving private data in WP
25:31 Security Plugins for WP
29:11 Monitoring with Visual Regression Tests
Links
WP Scan: https://wpscan.com/wordpress-security-scanner
Patchstack: https://patchstack.com/
VRTs: https://bleech.de/en/products/visual-regression-tests/
More Security Tips: https://bleech.de/en/blog/protect-website-from-hackers/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iRGVwbG95aW5nIGNvZGUgdG8gYSBXZWJzaXRlIC0gV2hhdMOiwoDCmXMgdGhlIEJlc3QgU3RyYXRlZ3k/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL2RxVmZOMXgtZ2xJP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Deploying code to a Website – What’s the Best Strategy?
In today's episode, Steffen and Dominik explore the pros and cons of deployment strategies for websites. What's the difference between continuous deployment and continuous integration? Which strategy is worth trying and which one should you consider leaving alone?
Highlights of the episode
00:00 Intro
00:13 What is continuous deployment
06:42 Buddy.works
08:46 Github Actions
10:50 Speed of Buddy
15:18 Docker
19:42 Managed Hosting
20:34 AWS
22:07 All-Inkl
25:39 Github Repo
27:58 Versioning website releases
Links
Continuous Deployments w/ GitHub Actions: https://css-tricks.com/continuous-deployments-for-wordpress-using-github-actions/
Buddy: https://buddy.works/
Github Actions: https://github.com/features/actions
All-inkl: https://all-inkl.com/PA4A94BC2F49CD0 (Affiliate Link)Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iR2xvYmFsICZhbXA7IFRyYW5zbGF0YWJsZSBPcHRpb25zIHdpdGggQUNGIFBybyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9pVmdhTmlBQXRCST9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Global & Translatable Options with ACF Pro
In this episode, Steffen and Dominik discuss the concept of global and translatable options for WordPress websites. Components can have options that are either limited to where they are inserted, or that apply to all components of a certain type on the site, even for different languages. This concept makes it easier for developers and editors to maintain and manage websites.
Highlights of the episode:
00:00 Intro
00:10 How global & translatable options work?
04:18 ACF Option pages
06:25 Use Cases
08:14 Standardize option pages
11:39 Downside of global options
13:00 Structuring options
14:14 Manage multiple languages with WPML
17:17 Translatable options
20:50 Going without ACF Pro
22:18 WP translation functionality
26:11 Localisation Feature of WordPress
31:37 More flexibility with Global and Translatable options
Links:
Flynt: https://flyntwp.com/
ACF Option Pages: https://www.advancedcustomfields.com/resources/options-page/
WordPress Internationalization Functions: https://developer.wordpress.org/apis/internationalization/internationalization-functions/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iVGhlIHNlY3JldCBjaGFuZ2UgaW4gTGlnaHRob3VzZSAxMCIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC8yM2hqYTFwSmhPWT9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==The secret change in Lighthouse 10
In today's episode, we discuss the latest update to Google's Lighthouse tool. Version 10 introduces significant changes to the way Page Speed scores are calculated. We discuss the key features of the update and how they might affect website owners and developers.
Upon closer inspection, we spotted an important change that hasn't been announced. So stay tuned for the episode!
Highlights of the episode
00:00 Intro
00:10 What is Lighthouse?
01:26 What is new?
03:10 CLS metric
07:09 Why some scores will decrease
08:40 Using custom fonts
12:29 FOUC and FOUT
15:38 Rendering issues / Loading CSS
17:48 Back/forward Cache
20:43 Paste-preventing input
22:50 Scoring Calculator
25:34 Mobile device size
29:14 Mobile layout
30:50 Responsive images
Links
PageSpeed test: https://pagespeed.web.dev/
Announcement Blog Post: https://developer.chrome.com/blog/lighthouse-10-0/
GitHub Release: https://github.com/GoogleChrome/lighthouse/releases/tag/v10.0.0
Scoring Calculator: https://googlechrome.github.io/lighthouse/scorecalc/
Cumulative Layout Shift (CLS): https://web.dev/cls/
Flynt: https://flyntwp.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iV2h5IHlvdSBzaG91bGQgY29kZSBjdXN0b20gZGVzaWducyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9FN3VPQWpSTDV5WT9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Why you should code custom designs
This time Steffen and Dominik reflect on coding custom designs and the challenges faced with writing CSS. To create a solid base stylesheet in combination with minimal styles for a website is an important starting point. However, it is challenging to create things by hand, interlinking layout and design, and maintaining components. Frameworks could be a solution, but they have a big disadvantage.
Highlights of the episode:
00:00 Intro
02:53 Best way of coding custom designs
07:07 Challenges
12:50 Component Frameworks
14:39 Is writing HTML & CSS programming?
15:42 Design of interfaces (today)
18:42 Great Design = ruleset
20:45 Skillset of a frontend developer
26:29 Pros & Cons of CSS frameworks
30:34 Building up confidence
31:54 A good Schlusswort
Links:
Tailwind CSS: https://tailwindcss.com/
Cube CSS: https://cube.fyi/
Andy Bell: https://buildexcellentwebsit.es/
Flynt: https://flyntwp.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iQ3JlYXRlIGEgYmV0dGVyIFVJIHdpdGggZGF0YSBtb2RlbGluZyBpbiBXb3JkUHJlc3MiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQvR1A3NF9JcmJqNkE/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=Create a better UI with data modeling in WordPress
Data modeling is the process of creating a conceptual representation of your data. It's a crucial step in building effective databases and applications. In this episode we discuss why it is important to look at both aspects of data modeling: how data is structured and how it is presented in the user interface for those who work on the website.
Highlights of the episode
00:00 Intro
00:10 What is data modeling?
03:09 Two perspectives on data modeling
04:11 From Waterfall to Agile
05:31 Challenge: Open Source Starter Theme + ACF Pro (paid)
09:03 ACF Pro is not easy to replace
10:40 The Fields API
14:50 Clone Field
17:40 Atlas Content Modeler
18:50 WP custom fields UX fails
19:55 Free alternatives to ACF Pro
22:13 Plugin Comparison for custom fields
25:25 Carbon fields
26:40 Custom fields and Gutenberg
27:36 Improve UI with data modeling
Links
Gutenberg: https://wordpress.org/gutenberg/
Flynt: https://flyntwp.com/
ACF Pro: https://www.advancedcustomfields.com/pro/
Atlas Content Modeler: https://github.com/wpengine/atlas-content-modeler
Compare WP: https://docs.google.com/spreadsheets/d/1mSqienVYxLopTFGLPK0lGCJst2knKzXDtLQRgwjeBN8/edit#gid=3
Carbon fields: https://carbonfields.net/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iV2lsbCB3ZWIgY29tcG9uZW50cyByZXZvbHV0aW9uaXplIHRoZSB3ZWI/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL1JDS180S2FreUNFP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Will web components revolutionize the web?
In this episode we discuss web components and their potential to revolutionize the web. Web components have been around for a while and aim to provide a standardized way of authoring front-end JavaScript, but they never really took off due to the missing parts of the spec. We explore various types of web components, the issues with JavaScript, and the challenges in picking the right approach to create a web component.
Highlights of the episode
00:00 Intro
00:10 Revolutionary or dead?
04:30 Why it's not popular yet
06:15 61 ways – What's the difference?
07:37 What to do with custom elements?
10:10 Extending built-in elements
12:01 Browser Support
16:36 Example: relative-time
20:08 Benefits
25:13 Front-end JavaScript
26:52 Customize an element
27:47 Can you expose APIs?
30:44 A step to bring Frontend and Backend together
Links:
Flynt: https://flyntwp.com/
webcomponents.org: https://www.webcomponents.org/
Browser support: https://caniuse.com/?search=custom%20elements
Relative-time element: https://github.com/github/relative-time-elementLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iVW5kZXJzdGFuZGluZyBXb3JkUHJlc3MgU3RhcnRlciBUaGVtZXMiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQveHZpMXlOejBNSTg/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=Understanding WordPress Starter Themes
WordPress Starter Themes are important for custom WordPress web development. Above all, they put developer experience first and challenge the status quo of best practices. We discuss the differences between a developer starter theme and a multi-purpose theme, and why using a starter theme can give you a big head start in your custom theme development to achieve better results.
0:00 Intro
2:44 Multipurpose vs. Starter Themes
5:21 Benefits of Starter Themes
8:34 Approaches to Starter Themes
16:03 Popular Starter Themes
17:44 What makes a good Starter Theme?
20:40 The future of themes
24:13 Why we build Flynt
26:52 Gutenberg redefined themes
31:06 Challenging the status quo
33:37 Better developer experiences
Links:
Flynt: https://flyntwp.com/
underscores: https://underscores.me/
Sage: https://roots.io/sage/
Episode w/ Jared Novack (Timber): https://youtu.be/c3GlhhwpKRo
Popular Starter Themes: https://github.com/topics/wordpress-starter-theme
Episode about Gutenberg: https://youtu.be/m-nLuvchssg
WordPress block hydration experiments: https://github.com/WordPress/block-hydration-experiments/discussions/131Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iVGVjaG5pcXVlcyBmb3IgcGVyZmVjdCByZXNwb25zaXZlIGltYWdlcyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9qelJMV1loWnJBQT9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Techniques for perfect responsive images
It's still a complicated task to optimize images for different devices, screen sizes, and pixel densities. In this episode we discuss the challenges of creating perfect responsive images and explore various techniques that can help optimize images.
Highlights of the episode:
00:00 Intro
00:50 Why is it so hard?
03:56 What do you need?
05:04 The sizes attribute explained
09:39 Library: lazysizes
13:22 Couldn't browsers do better?
16:13 Idea: better progressive images
19:19 Computing power and bandwidth
20:55 Focus on mobile PageSpeed
23:13 WordPress default sizes attribute
27:00 The Shrinkening
28:08 Fluid layouts & clamp
29:28 WordPress max image size
31:43 Good enough vs. perfect
32:50 Fetchpriority=high
34:41 The picture element
37:09 Background images
Links:
Lazy Sizes: https://github.com/aFarkas/lazysizes
Flynt: https://flyntwp.com/
PageSpeed Module: https://developers.google.com/speed/pagespeed/module
Add "auto sizes" for lazy-loaded images: https://github.com/whatwg/html/issues/4654
Optimizing The Image Element LCP: https://www.smashingmagazine.com/2023/01/optimizing-image-element-lcp/
WordPress max image size: https://developer.wordpress.org/reference/hooks/big_image_size_threshold/
WordPress default sizes: https://developer.wordpress.org/apis/responsive-images/#browser-sideLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iRW50ZXJwcmlzZS1sZXZlbCBXb3JkUHJlc3MgaW50ZXJmYWNlcyB3aXRoIEphcmVkIE5vdmFjayIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9jM0dsaGh3cEtSbz9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Enterprise-level WordPress interfaces with Jared Novack
Jared is the author of Timber, a powerful development library for WordPress with more than 1 million downloads. Jared started his career working at newspapers. He and his partners saw the importance of the backend user experience in digital publications and started using WordPress to develop custom built WordPress interfaces for large-scale websites. What does such an interface look like? And where does he see the future of content management and WordPress? Find out in our conversation.
0:00 Intro
1:09 WordPress is great, but the loop isn't
2:23 Timber's origins
3:57 Jared's background
8:43 Editor empathy × developer experience
15:06 WordPress usability studies
17:36 Gutenberg revolution vs. evolution
25:09 Timber 2.0
27:51 Getting out of the way
32:59 Consistency of WordPress
35:49 Building platforms that last
40:18 Structured data in WordPress
47:20 Large scale CMS interfaces
Links:
Timber: https://upstatement.com/timber/
Upstatement: https://upstatement.com/
Flynt: https://flyntwp.com/
Heroku: https://www.heroku.com/
Roots: https://roots.io/
ACF: https://www.advancedcustomfields.com/
Lumberjack: https://lumberjack.rareloop.com/
make: https://www.make.com/
Zapier: https://zapier.com/
Airtable: https://www.airtable.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iQ29udGFpbmVyIFF1ZXJpZXMgYXJlIGhlcmUhIENhbiB3ZSB1c2UgdGhlbSBub3c/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL2dUN0E1bGRkTmg4P2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Container Queries are here! Can we use them now?
Let's dive into the hotly-anticipated arrival of container queries! We’ll discuss whether it’s worth jumping on them now, what strategies you can follow, and the potential pitfalls to watch out for, including limited browser support, increased design and development complexity, and the potential performance issues. That said, let’s not be afraid, but embrace the future!
Highlights of the episode:
00:00 Intro
05:00 Defining a container query
07:18 Use cases
09:20 Built-in fallback
12:09 ACF Blocks in Gutenberg
14:04 New length units
17:11 Naming and nesting
25:55 Should we use them now?
32:58 Progressive enhancement ftw
Links:
Browser support: https://caniuse.com/css-container-queries
Polyfill: https://github.com/GoogleChromeLabs/container-query-polyfill
WP Podcasts: https://wppodcasts.com/
Nested container queries: https://developer.mozilla.org/en-US/docs/Web/CSS/@container#nested_container_queries
Gutenberg: https://wordpress.org/gutenberg/
Flynt: https://flyntwp.com/
Planning Poker: https://www.planningpoker.net/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iUGFnZVNwZWVkIDEwMCB3aXRoIEphdmFTY3JpcHQgSHlkcmF0aW9uIGFuZCBJc2xhbmRzIiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL2xIRkdta0RfcmpVP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+PageSpeed 100 with JavaScript Hydration and Islands
JavaScript can add significant weight to a website and is hard to optimize. JavaScript hydration concepts can significantly optimize JavaScript loading, parsing, and execution. We talk about the various techniques and how we implemented a custom islands architecture into Flynt, our WordPress Starter Theme for developers.
Highlights of the episode:
00:00 Intro
00:38 What is JavaScript Hydration?
02:58 Strategies of Hydration
04:41 What is so interesting about it?
06:56 Making JavaScript execution effective
11:32 Full hydration
12:57 Biggest improvement with islands
18:18 Load JS on current viewport
22:25 Three approaches + 1
23:38 Inspiration from libraries
25:43 Cut down JS as much as possible
30:22 You need a wrapper
31:32 Amazing results
Links:
Flynt: https://flyntwp.com/
webpack: https://webpack.js.org/
astro: https://astro.build/
is-land: https://is-land.11ty.dev/
qsa-observer: https://github.com/WebReflection/qsa-observerLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iR3V0ZW5iZXJnJ3MgZmF0YWwgZmxhd3MgLSB3aHkgaXQncyBub3QgZm9yIGFnZW5jaWVzIiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL20tbkx1dmNoc3NnP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Gutenberg’s fatal flaws – why it’s not for agencies
As a WordPress agency, we have decided not to use Gutenberg, the block editor for WordPress. When it was first introduced, we were excited about the potential improvements it offered over the classic editor, but after trying it out, we found that it had several major issues that prevent us from using it for our clients’ websites.
The user interface is less intuitive and the development experience is more difficult and less efficient than our current approach. We believe that there are better options available for our clients and for our development process.
Highlights of the episode
00:00 Intro
00:28 Potential of Gutenberg
03:11 Fundamental issues of Gutenberg
04:14 Issue 1: User Interface is not made for end users
19:15 Comeback of the webmaster?
22:13 Issue 2: Breaking design is too easy / HTML rendering
30:14 Experience with Gutenberg blocks based on ACF
34:07 Is Gutenberg worth using it?
34:36 Gutenberg works well for long copy editing
38:15 Issue 3: Fast development without central documentation
42:21 Should we use it? Not yet
Links:
Gutenberg: https://wordpress.org/gutenberg/
Flynt: https://flyntwp.com/
ACF Pro: https://www.advancedcustomfields.com/pro/
Elementor: https://elementor.com/
Beaver Builder: https://www.wpbeaverbuilder.com/
CSS Container Queries: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries
Content-only editing in Gutenberg: https://richtabor.com/content-only-editing/
10up Gutenberg Best Practices: https://gutenberg.10up.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iSG93IENoYXRHUFQgd2lsbCBtYWtlIHlvdSBhIGJldHRlciBkZXZlbG9wZXIiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQvbTRFcGtZV2pXdmc/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=How ChatGPT will make you a better developer
Everyone is talking about ChatGPT right now, just like us. What are our first experiences with the AI tool? How will it affect coding challenges in the developer application process? And how do we evaluate the relevance of AI tools for the future of coding?
Highlights of the episode
00:00 Intro
00:38 First experiences
03:30 Where does ChatGPT get the data from?
04:50 AI tools transform essential skills
08:02 Evaluating given information
11:05 Are specialized AI tools better?
17:20 Impact of AI on job interviews for developers
20:31 Will Copilot or ChatGPT become the new Stack Overflow?
23:43 Should you use ChatGPT in coding challenges?
27:50 Future meaning for coding?
Links
ChatGPT: https://openai.com/blog/chatgpt/
Github Copilot: https://github.com/features/copilotLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iU3RvcCB1c2luZyBKUEdzOiB1c2UgV2ViUCEiIHdpZHRoPSIxMTIwIiBoZWlnaHQ9IjYzMCIgZnJhbWVib3JkZXI9IjAiIGFsbG93PSJhY2NlbGVyb21ldGVyOyBhdXRvcGxheTsgY2xpcGJvYXJkLXdyaXRlOyBlbmNyeXB0ZWQtbWVkaWE7IGd5cm9zY29wZTsgcGljdHVyZS1pbi1waWN0dXJlOyB3ZWItc2hhcmUiIGFsbG93ZnVsbHNjcmVlbiBkYXRhLXNyYz0iaHR0cHM6Ly93d3cueW91dHViZS1ub2Nvb2tpZS5jb20vZW1iZWQvQ0NXUFl2cFVQWVk/ZmVhdHVyZT1vZW1iZWQmYW1wO21vZGVzdGJyYW5kaW5nPTEmYW1wO2F1dG9wbGF5PTEmYW1wO3JlbD0wIj48L2lmcmFtZT4=Stop using JPGs: use WebP!
When you're working with websites, you can't ignore the WebP image format. But what makes this format better than other image formats? And is it really practical and will stay? In this episode, Steffen and Dominik dive deep into image formats and discuss how to use WebP.
Highlights of the episode
00:00 Intro
00:48 How do you optimize image loading?
01:22 The old image formats of the web
02:55 The newer image format: WebP
05:35 How to optimize png and jpg for web
07:13 What’s so cool about WebP?
09:33 Why didn't we use WebP for a long time?
12:13 Who should convert images to WebP?
13:47 Why is it so great to use just one image format?
17:06 Upload WebP directly
17:30 Dominik has an idea…
20:33 Workflow of integrating WebP
29:09 The image resizing bug (Can somebody fix it, please!)
30:15 There's no ideal image size to upload
32:29 Use WebP!
Links:
Squoosh: https://squoosh.app/
Flynt: https://flyntwp.com/
WebP Express: https://wordpress.org/plugins/webp-express/
Blurry images bug report (2015): https://bugs.chromium.org/p/chromium/issues/detail?id=562162Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iTG9jYWwsIFJlbW90ZSwgRGV2LCBTdGFnaW5nLCBMaXZlOiBPdXIgV29yZFByZXNzIGVudmlyb25tZW50cyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC9LWEdFREFkWkRXcz9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Local, Remote, Dev, Staging, Live: Our WordPress environments
How do you make sure every developer on a website project sees the same content across environments? How do we maintain stable development environments for very old websites? And on which environments do we present code changes to our clients? In this episode Dominik and Steffen give insights how they set up the deployment and cloning process and architecture at Bleech.
Highlights of the episode
00:00 Intro
00:31 Why care about the development server setup?
01:44 How we deployed back in the days
05:24 How we synch database and assets across development environments
07:05 Local environments on a remote server
10:33 The challenge with maintaining build processes
15:07 How we set up environments, cloning and deployments
21:21 When we split development and staging
22:41 More environments increase complexity
24:34 Dominik's favourite stack and process
31:10 Beware of data privacy!
32:47 A typical workflow for new projects
37:26 The future of dev environments
Links
StackBlitz: https://stackblitz.com/
CodeSandbox: https://codesandbox.io/
InstaWP: https://instawp.com/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iRG9uJ3QgdHJ1c3QgeW91ciBXb3JkUHJlc3Mgb3B0aW1pemF0aW9uIHBsdWdpbiIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC8zRHJSaGU5QXlLbz9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Don’t trust your WordPress optimization plugin
With caching you can speed up the loading time of your website. In this episode Steffen and Dominik dig into types of caching and discuss different WordPress plugins. It seems popular caching plugins turn into huge optimization plugins, but they might not necessarily be the right choice.
Highlights of the episode
00:00 Intro
00:29 What is caching?
01:32 Three big types of caching
06:57 It's not the browser cache!
07:35 How to achieve the biggest impact with low effort?
10:44 Looking at different WordPress caching plugins
16:20 Think twice before choosing a complex plugin
17:45 How we cache browser assets indefinitely
23:23 Our advice on WordPress caching
32:38 Conclusion
Links:
Cache Enabler: https://de.wordpress.org/plugins/cache-enabler/
WP Super Cache: https://de.wordpress.org/plugins/wp-super-cache/
W3 Total Cache: https://wordpress.org/plugins/w3-total-cache/
Enable Media Replace: https://de.wordpress.org/plugins/enable-media-replace/
WP Fastest Cache: https://wordpress.org/plugins/wp-fastest-cache/
Autoptimize: https://de.wordpress.org/plugins/autoptimize/
WP Rocket: https://wp-rocket.me/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iR29vZ2xlIEZvbnRzIENhc2U6IEltcGFjdCBvbiB0aGUgRnV0dXJlIG9mIFdlYiIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC80LWREb2s3TnBaYz9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Google Fonts Case: Impact on the Future of Web
In this episode, Steffen and Dominik discuss why the verdict on the use of Google Fonts is so absurd. Does this mean that for all other services that work similarly, a ruling has to happen first? Will courts decide on designs in the future? And what could the ruling mean for free and paid fonts?
Highlights of the episode:
00:00 Why do people get sued over Google Fonts?
03:44 How to load fonts from a local server?
08:01 Why is the verdict absurd?
09:46 What's the problem with Google Fonts?
13:41 Loading Google Fonts via other services (reCaptcha)
22:43 Accomplish GDPR privacy = impact on competitiveness
29:10 Why is it so easy to load Google Fonts?
33:18 Future of paid and free fonts
Links:
GDPR: https://gdpr.eu/
Google reCAPTCHA: https://www.google.com/recaptcha/about/
Plausible: https://plausible.io/Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iVHJhY2sgV2Vic2l0ZSBDaGFuZ2VzIFdpdGggVmlzdWFsIFJlZ3Jlc3Npb24gVGVzdHMgaW4gV29yZFByZXNzIiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL19LOFJBTmlNUDUwP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Track Website Changes With Visual Regression Tests – Try this WordPress plugin
How to monitor your website for unwanted changes? In this podcast episode we talk about the less known technique of Visual Regression Testing. We explain how we started using those tests, in which cases they helped us and how we developed our own Visual Regression Tests (VRTs) WordPress plugin.
LinksLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iQ29uc2VudCBNYW5hZ2VtZW50IEdvbmUgV3Jvbmc6IERvZXMgWW91ciBDb29raWUgQmFubmVyIFdvcmsgYXMgRXhwZWN0ZWQ/IiB3aWR0aD0iMTEyMCIgaGVpZ2h0PSI2MzAiIGZyYW1lYm9yZGVyPSIwIiBhbGxvdz0iYWNjZWxlcm9tZXRlcjsgYXV0b3BsYXk7IGNsaXBib2FyZC13cml0ZTsgZW5jcnlwdGVkLW1lZGlhOyBneXJvc2NvcGU7IHBpY3R1cmUtaW4tcGljdHVyZTsgd2ViLXNoYXJlIiBhbGxvd2Z1bGxzY3JlZW4gZGF0YS1zcmM9Imh0dHBzOi8vd3d3LnlvdXR1YmUtbm9jb29raWUuY29tL2VtYmVkL3FnV2RvZjlmZlVrP2ZlYXR1cmU9b2VtYmVkJmFtcDttb2Rlc3RicmFuZGluZz0xJmFtcDthdXRvcGxheT0xJmFtcDtyZWw9MCI+PC9pZnJhbWU+Consent Management Gone Wrong: Does Your Cookie Banner Work as Expected?
We've seen it many times: a cookie banner pops up on a website, but it's clearly not working as expected. External scripts are loaded right away and cookies are set without consent. What's okay to load, what isn't? How are necessary cookies defined? Who's responsible? And what would we like to of see consent management in the future?
LinksLearn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy! -
PGlmcmFtZSB0aXRsZT0iUmV2ZWFsaW5nIEJsYWNraGF0IFBhZ2VTcGVlZCBPcHRpbWl6YXRpb24gVGVjaG5pcXVlcyIgd2lkdGg9IjExMjAiIGhlaWdodD0iNjMwIiBmcmFtZWJvcmRlcj0iMCIgYWxsb3c9ImFjY2VsZXJvbWV0ZXI7IGF1dG9wbGF5OyBjbGlwYm9hcmQtd3JpdGU7IGVuY3J5cHRlZC1tZWRpYTsgZ3lyb3Njb3BlOyBwaWN0dXJlLWluLXBpY3R1cmU7IHdlYi1zaGFyZSIgYWxsb3dmdWxsc2NyZWVuIGRhdGEtc3JjPSJodHRwczovL3d3dy55b3V0dWJlLW5vY29va2llLmNvbS9lbWJlZC80WGxCUWZyU054OD9mZWF0dXJlPW9lbWJlZCZhbXA7bW9kZXN0YnJhbmRpbmc9MSZhbXA7YXV0b3BsYXk9MSZhbXA7cmVsPTAiPjwvaWZyYW1lPg==Revealing Blackhat PageSpeed Optimization Techniques
To start off the podcast, Dominik and Steffen dive deeper into the question: for what or for whom should PageSpeed be optimized?
The user should be in the main focus of PageSpeed optimization, because a fast website contributes to a good UX. But should you consider users who come for the first time to the homepage or should you look at returning visitors?
On the other hand a high PageSpeed score is one of the most important numbers for website clients these days. Does increasing the score – without the user in mind – force developers to think of techniques to trick the measurement tool?
Links- Our Website
- PageSpeed Insights
- Core Web Vitals
- Plausible
- Borlabs Cookie
- Flynt WordPress Starter Theme
- Partytown
- web-vitals JavaScript Library
Learn more about Bleech
Go to bleech.de
Read our blog
WordPress Starter Theme FlyntBleech on Social Media
LinkedIn: Bleech
YouTube: Siegfried, deploy!
Want more Bleech Insights?
Are you curious about what we have to say and want to stay up to date?
Then subscribe to Bleech Insights here!
powered by Borlabs Cookie