building-blocks

To implement an AEM Edge Delivery block, create the block folder structure, write a default async JavaScript decorate function, and add scoped CSS to prevent style leakage. Follow deferred loading and performance best practices enforced by the project guidelines.

The best way to scope CSS for AEM Edge Delivery blocks is to confine styles within the block's dedicated folder structure. This enforces scoped styling that prevents style leakage and maintains visual consistency across the Edge Delivery project.

To safely modify core scripts.js and global styles, apply minimal surface-area changes with testing. Update delayed functionality carefully and verify changes using testing-blocks for browser validation, responsive checks, and linting.

Block development for AEM Edge Delivery requires integration with project helpers like aem.js. Implementers must also follow resources/js-guidelines.md and resources/css-guidelines.md documents to satisfy scoped CSS and JavaScript decoration requirements.

To validate AEM Edge Delivery blocks, invoke testing-blocks for browser validation, responsive checks, linting, and acceptance criteria verification. This testing integration ensures blocks meet performance and functional requirements before deployment.