AEM Champion Office Hours: AEM Sites (March 2023)

This was the first ever AEM Champion Office Hours, a live "ask me anything" session on AEM Sites. The panel of AEM Champions included RENY director Rami El Gamal, Greg Dimeris, Brett Birschbach, Martin Noble and Vengadesh Shanmugavelu, who answered pre-submitted and live questions from AEM practitioners.

What the session covers

• GraphQL and Experience Fragments: when to deliver structured data with Content Fragments and GraphQL, and when an Experience Fragment's HTML is the better fit.
• Code versus content: which configuration belongs in the codebase and which authors should manage, including editable templates.
• Repository growth: what to check when the replication folder keeps growing.
• Adobe Target with single page applications: why Experience Fragments delivered by Target may not render in a React SPA, and how to fix it.
• Form data: why you should not store personal data from forms in AEM.
• Headless or head-full: choosing between SPAs, headless delivery and server-side HTL.

Key takeaways

• Start with why. GraphQL is built for structured data that an application can query and filter. Experience Fragments carry HTML, which suits reusing authored layouts in another application but is a poor data format.
• Configuration that moves between tiers belongs in code. If a setting has to be recreated in development, stage and production, put it in the codebase so it is consistent and tested, rather than repeating manual steps in each environment.
• Check queues and maintenance before digging into nodes. A growing replication folder is often caused by stuck replication or workflow queues, or by skipped online and offline maintenance and compaction.
• Target and SPAs need coordination. Target injects content into the page, but a client-side React app renders from model.json and can overwrite or miss it. Load Target after the page renders, export Experience Fragments to Target as JSON, or have the app request personalization from Target directly for high-value components.
• Keep personal data out of AEM. Storing form submissions in the repository raises security, replication and compliance problems. Send them by email, to a CRM, or to a dedicated secure database instead.
• Headless versus head-full is not either-or. Strictly templated sites suit server-side HTL with full authoring, highly interactive experiences may suit an SPA, and the team's skills matter. Most organizations will have use cases for both.

RENY's perspective

We have run into the Target timing problem on client projects: Target loses the race when it arrives before the SPA has painted, because it cannot inject anything into model.json. Our recommendation is to load the Target script after the page renders, or to make model.json faster so the page paints earlier. On headless, every approach can work. The right choice depends on how strictly the site is templated and on the team's skills.

What's changed since 2023

• The SPA Editor is no longer Adobe's direction for new projects. The Universal Editor, which supports headless and head-full sites, is now the recommended visual editor.
• Edge Delivery Services has become Adobe's fast, server-rendered option for marketing sites, which adds a third choice to the headless versus HTL debate.
• In AEM as a Cloud Service, publishing uses Sling Content Distribution instead of classic replication agents, and Adobe runs maintenance tasks for you, so the replication clean-up advice applies mainly to on-premise and Managed Services.

How RENY helps

We design AEM Sites architectures, from content models and personalization with Adobe Target to choosing between Edge Delivery Services, headless and HTL. Talk to an AEM architect.