SiteGenesis Vs. Storefront Reference Architecture (SFRA). Why SFRA is the Better Option?

May 11, 2022

What is Salesforce Storefront Reference Architecture?

The Storefront Reference Architecture was launched by Salesforce B2C commerce
This offers retailers a starting point for building state-of-the-art shopping experiences faster and easier than before. The user experience has been optimized for mobile devices, making it much more efficient, robust, scalable, and modern than the older SiteGenesis platform.

What is Salesforce SiteGenesis?

Salesforce acquired Demandware, originally built on Intershop. Demandware, an upstart, was one of the first companies to offer SAAS (Software-as-a-Service) for eCommerce. As the predecessor of SFRA, the SiteGenesis architecture does not natively support mobile web experiences, has slower performance, and does not offer code extensions.

Major Differences Between SFRA and SiteGenesis:

In this blog, SFRA and SiteGenesis are compared based on the following criteria,

  • Business Value Generated
  • Architecture

Business Value Generated:

FeaturesMaintainability & Extensibility Customer ExperienceContinuous IntegrationTotal Cost of Ownership 
Storefront Reference ArchitectureImproved extensibility and inheritance model encouraging modular code and smaller changes.Mobile-first design, best practices influenced by data-driven design, heat mapping, and shopper journey analysis.Improved support for continuous integration and automation testing – including unit, integration, and functional tests.Collectively the mobile-first approach and architectural improvements are designed to reduce TCO compared to SiteGenesis.
SiteGenesisLegacy inheritance model is functional but encourages code duplication; more challenging to maintain as the codebase ages.Desktop to the responsive design includes more features per form factor to maintain within the storefront codebase.Includes support for continuous integration – but lacks the examples that ship with SFRA or the command-line tooling.While an effective option for customers, maintaining SiteGenesis in the future will result in higher TCO compared to SFRA. 

Architecture:

SFRA follows the MVC (Model-View-Controller) architecture. This enables the user to create new features and functionalities without duplicating the templates. The existing models and controllers can be extended to create the required functionalities. All business logic is centralized in the controllers and is removed from the templates.

On the other hand, SiteGenesis is a single code structure. It has a monolithic architecture and therefore in order to add new features to the store, developers have to duplicate the existing templates and make changes to the code. SiteGenesis uses an old software architecture.

Why is SFRA a better option than SiteGenesis?

Architectural Enhancements in SFRA:

Mobile-First design: The sites are developed mobile-first and built from the bottom up into a fully responsive desktop site.

Improved Features:

  • SFRA optimized modular design and components make it easier for non-IT business users to build their pages. In other words, Business teams can start building pages with zero IT dependency.
  • Improved wireframes and UX including single-page accordion-style checkouts and collapsible summaries.
  • Framework that enables fast, easy, and customized websites that are pixel perfect and with an extensibility model to build a unique brand experience.

Following integrations are included with SFRA:

  • In-store pickup
  • Apple Pay
  • Gift Registry
  • Wishlist
  • Site Map
  • Product compare
  • GDPR Customer Data Download

Code Customization and Maintainability

Commerce Cloud suggests developers customize the SFRA through overlay cartridges without making changes to the codebase, for proper separation of custom code and easier upgrading in the future. This makes implementing new features, bug fixes, and future upgrades easier as compared to Site Genesis where upgrades are done manually.

Modern Framework: Bootstrap 4, and jQuery frameworks are used to write templates. It provides enhanced page speeds and client-side page performance.

Better UI/UX: SFRA base templates have been created with the best practices backed by research and thousands of audits by Salesforce which analyze the impact of UX on site performance.

Testability: SFRA improves testability by leveraging unit tests for all base functionalities

  • Controllers are tested using integration tests (mocha, chai, and request-promise)
  • Models are tested with unit tests (mocha, chai, sinon, and proxyquire)
  • Views are tested with functional tests (mocha, chai, and webdriver.io)

Technical Improvements in SFRA:

Administers Development of Modular, Maintainable, and Upgradeable Code
SFRA encourages developers to write less code because functionality can be extended by out-of-the-box and easily configurable components instead of copying code and modifying it.

Automatic Support for CI/CD (Continuous Integration, Continuous Deployment)
CI/CD tools are included for automated deployments and testing
Industry Standard Development Patterns
SFRA supports MVC and middleware patterns which is recommended by the Industry leading app-engines (express.js)

Data Models and Format (JSON)
SFRA supports extensible data models and data transfer in serialized JSON format which is the industry standard.

Amended Class Inheritance and Extensibility Model
SFRA base framework for models and controllers can be untouched with new classes developed as extensions hence avoiding duplication of code which was the norm in Site Genesis.

Easily available Developer Libraries to enhance Storefront Experiences
Popular libraries like Bootstrap, and jQuery structure the layout, component, and user experience on Storefront.

In conclusion, Storefront Reference Architecture is better than SiteGenesis simply for the fact that SiteGenesis was for the previous generation which relied on desktop websites. More than 50% of the traffic generated all over the world is generated through mobile devices and it makes sense to give importance to mobile-first applications.

Not to mention, SFRA is technically and architecturally superior to SiteGenesis as stated above. If you have an eCommerce website that is still running with SiteGenesis, our humble suggestion is to consider migration to SFRA. We have written about migration from SG to SFRA here. It is always better to hire experts in Salesforce for the migration process, for it is better to be safer and sure. Contact ASR Tech Group’s Salesforce Experts today and embrace the future!