What it Takes to be a Salesforce Commerce Cloud Expert – Best Practices Every Developer Needs to Know
10+ years of heads-down development in the most demanding, fast-paced e-Commerce retail environments has given me a unique perspective on how to be a successful Salesforce Commerce Cloud developer. 
While certifications and training courses are great and highly informative – I carry two (2) SFCC Certifications (Technical Architect/Integration Designer and Certified Developer) – there’s simply nothing like learning from real-world experience.
In this post I’ll be discussing several key best-practices I’ve learned from my trial by fire. I guarantee if you take to heed and follow these lessons, you’ll not only take your SFCC client experience to the next level but your career as well. Let’s get started with the most important lesson, performance; a fast site is a profitable site.
The 411 on Salesforce Commerce Performance
Website performance is a measure of how fast your website pages are displayed. Shoppers these days expect fast, consistent and seamless experiences. In 2009 consumers expressed they would abandon a potential purchase if a given site did not load in 3-seconds or less. Can you imagine the expectation today in 2020?
Optimizing the performance of your website also significantly impacts on customer loyalty, SEO performance and many other critical tenants of your e-Commerce presence. Simply put, performance is everything.
Let’s take a look at what are the best practices – Front End, Memory Management, High Visibility Page Optimization, Scheduled Jobs, etc. – that you need to consider as an SFCC developer for improving website performance.
Front-end Performance
The first step towards a performant site is ensuring your front-end renders and responds immediately for your customers. This of course is challenging as most of the page load time is consumed by browser processing, meaning there’s not a lot directly in your control; however, what you can control makes all the difference if managed properly.
The most important items to focus on to ensure the highest levels of site performance in your front-end are:
- CSS Sprites: Spriting combines multiple images into a single image and then uses CSS to call a specific piece of the image at a specific time and location. This reduces the number of HTTP server calls to render a page. It also saves bandwidth, which is important when pages are rendered over a cellular or low-bandwidth connection.
- Minification: Makes your storefront web page smaller and easier to load by minifying the JavaScript and CSS code. It does this by eliminating white space and unnecessary characters and shrinking variable names. The smaller file loads faster than its larger version.
- Combined CSS: Reduces the number of CSS files used (Optimal to have one CSS file), resulting in fewer HTTP server calls and faster page load times.
- Control page weight: Total page weight should not exceed 1.5MB.
- Make Fewer and Smaller HTTP Requests which can be achieved by considering the following points:
- Reduce the Size and Number of Cookies.
- Reduce the Number of Images.
- Consider hidden requests carefully such as @import in css file.
- Using GET vs. POST Requests: GET requests can be cached but POST is never cached and are therefore slower than other requests.
- Avoid using iFrames since it blocks the browser onload event and each Iframe is a separate HTTP request.
- Move CSS to the top of your pages and JavaScript to the bottom of your pages.
- Put Flash files before JavaScript but after the rest of the page; Flash files can trigger reload operations.
- Make sure all data delivered to the HTTP client is gzipped, with the exclusion of images and data for some older browsers.
- Minimize Image Size.
- Use a Content Delivery Network
Memory Management
You’ll no doubt encounter incredibly large sets of data even when dealing with a single customer. With personalization on an exponential rise, e-Commerce retailers and their technology partners are interested in collecting and consuming as much information as possible for each customer.
This means, as an SFCC developer, you’ll need to efficiently manage your application to ensure it works well with this tremendous and ever-increasing volume of data. In particular, focusing on the following tenants of memory management will ensure your SFCC application is not only performant today, but with tomorrows data volume as well:
- Design loop logic so that memory consumption doesn’t increase with result set size.
- Keep only currently processed objects in memory, and do not retain references to that object (so that the object can be freed from memory). Specifically, don’t perform sorting or other types of collections in memory.
- Stream data to file regularly (do not build large structures in memory).
- Read feeds record by record (do not read an entire file into memory).
- Don’t put Iterators with more than 100k objects into the Pipeline Dictionary. The current Pipeline Dictionary implementation caches objects in memory while iterating over them, which can cause the system to run out of memory. Instead, use the Script pipelet, query the objects with the B2C Commerce Script API and iterate over them within the same script. The maximum script timeout of 60 minutes can be relaxed. Contact Commerce Cloud Support if needed.
- If you need to create multiple feeds, query the objects once and write records to all feeds as you iterate over the results. This will save time because the objects only need to be created in memory only once.
- The system is designed to deal with transactions with up to 1,000 modified business objects. A storefront pipeline shouldn’t even come close to this number.
Ensuring Popular Content is The Best Performer
Making a bad first impression can be the difference between attracting a new customer or losing a potential sale. In the past retailers would solely focus on their homepage load time. Consumer behavior has changed. Today, Category Pages and Product Detail Pages are now more visited than the homepage.
As such it’s prudent to ensure any views with high volume or were traffic (e.g. email campaigns) is directly funneled to are the most important part of any e-Commerce website because they give the first impression. Here’s how you can readily optimize these views:
- Find out what your first pages are.
- Make your first pages the fastest loading.
- Include CSS and JavaScript inline on first pages. However, it is best practice to make CSS files external rather than inline. This lets you reuse CSS more effectively.
- Reduce graphics and JavaScript on first pages.
- Make sure the most visited pages are cacheable and well performing. These are usually category page/search result pages (Search-Show), product detail pages (Product-Show) and home pages (Default-Start, Home-Show).
- Don’t trigger live calls to external systems on frequently visited pages. Where live calls are needed, specify a low timeout value (for example, 1 second). A B2C Commerce application server thread waiting for a response from an external system can’t serve other requests. Many threads waiting for responses can make the entire cluster unresponsive, for any pages.
Jobs and Schedulers
SFCC Jobs are extremely power. They allow automation of routine, time-consuming tasks or long-running processes, for example importing and exporting data, replicating data or code and building a search index.
Ensuring your Jobs and associated Schedulers are configured correctly can turn a 2-hour job into a 5-minutes. Make sure to consider the following points while creating your jobs:
- Always use standard imports instead of customizations; the standard imports take a feed in the B2C Commerce format as input. Create the feed in an external system and use the “Simple Feed Integration” component for the download/import handshake.
- Keep application server utilization by jobs to minimum. Calculate the job load factor: total number of seconds of job execution time on an instance (Staging or Production) on a day divided by 86,400 (number of seconds in a day). Try to keep the job load factor below 0.20.
- Pay attention to recovery in solution design. A job might end abnormally, for example, server restart or application server failure. Design the job so that it recovers automatically, for example, it recognizes what files have not yet been imported during subsequent execution.
- You cannot create jobs with controllers. Jobs can only be created using pipelines and recently using scripts.
There’s External Help Available
Fortunately, with the growth of SFCC over the past decade, Salesforce has developed many built-in Business Manager tools to audit your sites performance. Many of which not only will indicate potential issues, but offer solutions as well.
- Pipeline Profiler: Use the pipeline profiler to tune the performance of scripts and pipelines during development and testing. You must trigger the pipeline in the storefront for the Pipeline Profiler.
Pipeline shouldn’t take more than three seconds to execute when it includes non-cached components and no more than 250 milliseconds when it includes cached components. Salesforce B2C Commerce also recommends that you use the pipeline profiler on production to find performance bottlenecks, but only for about fifteen minutes - Code Profiler: The Code Profiler provides insights into run-time performance.
- Technical Reports: The Technical Reports dashboard gives you insights about your site’s server-side technical operations data, including pipelines and controllers.
Quota Consideration
Salesforce B2C Commerce includes constraints and limits to ensure the efficiency and stability of solutions built on the platform. These limits concern memory usage, resource consumption, API calls, and the number of business objects.
Quotas serve to monitor resource usage in custom code. Resources include memory, application server threads, and database table sizes.
You can view quota status and limits in the Administration module. This information readily allows identification of issues with code, giving you the opportunity to address them before they cause significant, customer-facing problems. You can also view Quota violations in the Quota log files.
Developers also have the ability to configure the SFCC Business Manager send out a daily summary of all quotas that are in violation.
It’s important to note a quota can be viewed as two disparate types; either enforced or not enforced. If an enforced quota is exceeded, an exception is thrown preventing the current operation from completing.
The exception can’t and shouldn’t be caught within a customization. If a quota isn’t enforced, B2C Commerce doesn’t act when the limit is exceeded.
It is very important you understand that when Quota is exceeded then that means your custom code is using supported capabilities inefficiently and you need to adjust your implementation to leverage a more efficient solution.
Once you’re confident your SFCC performance profile is optimized, you can now focus on optimizing your content.
On to Content
Not only does content drive your customer experience, customer loyalty and differentiate you from a crowded market, content educates search engines about your website. You should always keep in mind how your website is portrayed to search engines and the message accurately communicates your brand, purpose and differentiators.
Content can be introduced to an SFCC website through either content asset or content slot.
Content Slots
A content slot is a preconfigured place on the storefront where a merchant can show one of the following:
- Products
- Categories
- Content Assets
- Static HTML
- Product Recommendations
- Einstein Algorithm
Content Assets
Content assets provide customers non-product related information such as customer support pages, special sales, size charts, flash graphic, product carousel, product search result set, marketing graphic and gardening tips.
Which One is Right for Me – Content Slot or Content Asset?
It always comes to my mind on when to use content asset versus content slot, you can consider below to answer this question:
While the content slot feature is awesome, it adds complexity. Be careful what you configure as a content slot versus a content asset. Design static or infrequently changing content as a content asset; for example, a logo in the header or links in the footer. They change infrequently and don’t need to be scheduled, targeted, or tested.
Insider Tip: Don’t use more than six (6) content slots on a given page. As the number of content slots increases, page performance decreases.
It is also very important to consider encoding all displayed content within an ISML page, this helps preventing malicious attacks through content manipulation.
If a script expression such as ${pdict.ProductSearchResult.searchPhrase} is used in an ISML template, where the content type is set via the following:
<iscontent type=”text/html” charset=”UTF-8″ compact=”true”>
The script result is automatically HTML encoded. If content type is not set, then use <isprint value=”{}”/> to ensure the resulting HTML is encoded.
Power Level 9,000?
As a token of my appreciation for you reaching the end of this post, I want to share with you my personal tips and tricks to ensuring your SFCC Development work transforms to the next level.
Follow this advice to improve your SFCC deliveries and ensure you’re recognized as the rock-star you are:
- Always test cross-browser and cross-machine. Otherwise, you might miss important performance problems.
- Always use a load test to measure the server performance. Simpler is better. Simple pages are easy to maintain and are less error-prone. Search Engines can identify content better and modern devices are supported easily.
- Always use the same controller that renders the form to also handle the actions from the form.
- Obey standards or what works today might be broken tomorrow.
- Make sure your code is maintainable. While consolidating code and removing comments can make pages faster to load, it makes them more difficult to maintain.
- Focus on initial page rendering and then add external content via AJAX.
- Add progress bars to keep the customer informed and give an instant response to interaction.
- As a performance best practice, only import modules when you need them, not at the top of a module.
- It is best practice to use lower case for ISML tags.
- It is best practice that caching statements are placed at the beginning of a template.
- It is best practice to include an initial comment that describes the purpose, the requirements and the effect of a template from both a business point of view and a technical perspective.
- It is best practice to add includes that affect the whole page to the top of the template.
Conversely, if you value your career and reputation as an SFCC developer, make sure you don’t do the following:
- Don’t post-process product/content search results, search results can be large sets. Instead, all search criteria must go into the query for efficient execution. Don’t post-process with custom code.
- Don’t iterate over variants of a master on a search result page (or any page where multiple masters appear), this can significantly increase the number of touched business objects. Instead, use native Salesforce B2C Commerce features to deal with variant availability (pipelet Search, input parameter OrderableProductsOnly), to determine available variation values (dw.catalog.ProductSearchHit.getRepresentedVariationValues), or to determine price ranges (dw.catalog.ProductSearchHit.minPrice or Product.priceMode.minPrice).
- Don’t attempt to narrow the results by variation using scripts to process search results.If color is a slicing attribute, show all iPods in all colors, don’t attempt to iterate over the results to pull out only pink iPods via scripts. While this can be done, it requires post-processing of the full result set, which can impact the search performance. Instead, it’s recommended that you add a search refinement that lets the customer drill down a specific selection. Any result processing that requires that you iterate through all the results can make search a lot slower.
- Do Break search results into pages before processing/appearing in the storefront (pipelet Paging, class PagingModel). Instead, limit the maximum page size, for example, a maximum of 120 products per page, even/especially if the “View All” functionality is provided.
- Don’t trigger live calls to external systems on frequently visited pages (homepage, category/search result pages and product pages). Where live calls are needed, specify a low timeout value (for example, 1 second). A B2C Commerce application server thread waiting for a response from an external system can’t serve other requests. Many threads waiting for responses can make the entire cluster unresponsive, for any pages.
- Don’t execute any long running operations in a storefront pipeline (for example, import/export). Instead, use “jobs” for all long running tasks. The web tier closes browser connections after 5 minutes. The pipeline might still be running at this time.
- Avoid concurrent changes to the same object, storefront pipelines should only read shared data (for example, catalogs and prices) and read/write customer specific data (for example, customer profiles, shopping carts or orders). This avoids making concurrent changes. The inventory framework is designed to support concurrent change (for example, two customers buying the same product at the same time or a customer buying a product while the inventory import is running). The storefront pipeline marks the order with EXPORT_STATUS_READY as the last step in order creation. Then order processing jobs can start modifying the order object. Concurrent requests for the same session are serialized at the application server.
- Don’t implement sanity/plausibility jobs on B2C Commerce. For example, products with no names or $0 prices. Instead, ensure that the feeds into B2C Commerce are of high quality, and don’t include products with incomplete attribution or are marked offline. You can manually review catalog data on a staging instance. You can filter certain criteria with the Search pipelet, for example, including only available products in the search results.
- Avoid concurrent changes to the same object, use the locking framework to ensure exclusive access. Specify named resources for job schedules.
- Don’t start many jobs at the same time. Instead, disperse job start times to balance the job load.
- Don’t over-optimize. Keep XHTML and CSS meaningful and maintainable.
- Avoid 301(permanent) and 302(temporarily) Redirects. The 301 redirect is considered a best practice for upgrading users from HTTP to HTTPS.
- Avoid 404 Errors and 404 Pages. 404 errors impacts performance because the missing item can’t be cached and therefore tries to retrieve it each time the request is made. 404 pages also impact the selling potential of a site as such include the following in 404 pages:
- Graceful message explaining potential reasons of why this page cannot be found.
- Featured Products.
- Sitemap.
- Search box.
- Avoid doing the following with controllers. It is not best practice for controller to do any of the following:
- Call other controllers: It isn’t recommended that controllers call each other, because controller functionality should be self-contained to avoid circular dependencies. In some cases, however, such as calling non-public controllers during the checkout process, it is unavoidable.
- Call pipelets: Calling pipelets from within a controller is strongly discouraged. It’s allowed while there are still pipelets that don’t have equivalent B2C Commerce script methods, but will not be supported in future.
- Import packages. This is discouraged as it doesn’t use standard JavaScript patterns, but is Rhino-specific.
- Call pipelines that don’t end in interaction continue nodes. This is only intended for use with existing link cartridges and is highly discouraged for general development. However, it isn’t currently possible to call pipelines that end in interaction continue nodes.
- Don’t cache pages that show buyer or session information.
- Don’t mix pipelines and controllers in a single cartridge.
- Avoid using iFrames as it is B2C commerce best practice to avoid using them.
- Do not use B2C commerce for video streaming. B2C Commerce doesn’t support streaming video of any kind, because they don’t have a streaming server. Video files up to 20MB are cached. Video files greater than 20MB are not cached, but delivered in streaming mode, which degrades performance. Simply, use LINK partner technology for video hosting; several LINK technology partners such as CorMedia and Informatica Corp, provide rich media functionality. Additional video solutions include YouTube and Vimeo.
