Last Updated on April 15, 2019 by Rakesh Gupta
The Lightning Component modern framework is a User Interface framework to develop dynamic web apps for mobile and desktop devices. As is the case with each release, the latest Winter‘19 release is packed with rich features including, the newly added Lightning Component features!
Currently, Winter’19 release is available under the pre-release program. On the 7th and 8th of September, Sandboxes will be upgraded; as a result, your organization will get the look and feel of Winter’19 release.
If you have not read the entire 470 pages of Salesforce Winter’19 release notes yet, check out Winter’19 release quick summary and, the Top 10 Lightning Experience Gems of Salesforce Winter’19 Release! written by me.
I combed through the release notes and highlighted the added capabilities to the Lightning Component features. Believe me, it was hard to stop at just five! To kick things off, here is my take on the coolest Lightning Component features from Winter’19 release.
1) Build Exciting User Interfaces with New Base Lightning Components:- Now you can accelerate your development with a fresh medley of new built-in Lightning components. The new components cover a broad range of user interface elements and give you a whole new tool bag for your development. Following are few of the new component features. Please note that these features require API version 44.0 or later.
a) lightning:map: – The lightning:map component securely displays a map of one or more locations using Google Maps. You can pass markers to the component to define the locations to map. A marker can be a coordinate pair of latitude and longitude, or a set of address elements: City, Country, PostalCode, State, and Street. Following screenshot display the map component with one address.
b) lightning:menuDivider: – The lightning:menuDivider component is used as a child component of lightning:buttonMenu. Use lightning:menuDivider to create a dividing line after a menu item. By default, space is added above and below the divider. Use variant=”compact” with lightning:menuDivider to reduce the space.
c) lightning:empApi: – Embed the lightning:empApi component in your custom Lightning component to subscribe to a streaming event channel and receive event notifications. You can subscribe to any type of event channel on the Lightning Platform, including channels for platform events, PushTopic, and generic events, and Change Data Capture (Developer Preview) events. The lightning:empApi component uses a shared CometD-based Streaming API connection, enabling you to run multiple streaming apps in the browser.
e) lightning:menuSubheader: – The lightning:menuSubheader component is used as a child component of lightning:buttonMenu. Use lightning:menuSubheader to create subheadings in the list of menu items. Specify the text of the heading using the label attribute.
2) Mark Apex Method as Cacheable:- Mark an Apex method as storable (cacheable) instead of using setStorable() on every JavaScript action that calls the Apex method. This change enables you to centralize your caching notation for a method in the Apex class.
Marking a method as storable improves your component’s performance by quickly showing cached data from client-side storage without waiting for a server trip. If the cached data is stale, the framework retrieves the latest data from the server. Caching is especially beneficial for users on high latency, slow, or unreliable connections such as 3G networks.
Prior to Winter ’19, to cache data returned from an Apex method, you had to call setStorable() in JavaScript code on every action that called the Apex method. Now, you can mark the Apex method as storable (cacheable) and get rid of any setStorable() calls in JavaScript code.
To cache data returned from an Apex method for any component with an API version of 44.0 or higher, annotate the Apex method with @AuraEnabled(cacheable=true). For example:
@AuraEnabled(cacheable=true) public static Account getAccount(Id accountId) { // your code here }
To update an existing component to use an API version of 44.0, remove setStorable() calls in JavaScript code. Annotate the Apex method with @AuraEnabled(cacheable=true) instead of @AuraEnabled, or you will get an error response for the action.
3) Enable CDN to Load Lightning Experience Faster:- Load Lightning Experience and other apps faster by enabling Akamai’s content delivery network (CDN) to serve the static content for Lightning Component framework. A CDN generally speeds up page load time, but it also changes the source domain that serves the files. If your company has IP range restrictions for content served from Salesforce, test thoroughly before enabling this setting.
CDNs improve the load time of static content by storing cached versions in multiple geographic locations. This setting turns on CDN delivery for the static JavaScript and CSS in the Lightning Component framework. It doesn’t distribute your org’s data or metadata in a CDN. To enable CDN navigates to Setup | Security | Session Settings, then select Enable Content Delivery Network (CDN) for Lightning Component framework, once done click on the Save.
4) Freeze JavaScript Prototypes for Improved Security and Stability:- In JavaScript, each object has a prototype object. An object inherits methods and properties from its prototype object. Prototypes are shared between all objects of the same type. If a component author modifies a JavaScript prototype of a shared object, it can introduce unexpected behavior and potential security issues. Freezing JavaScript prototypes prevents Lightning component authors from modifying JavaScript prototypes of global objects that are shared between namespaces. This restriction enables better code separation between components and prevents malicious or inadvertent tampering of shared objects, such as the JavaScript APIs or DOM APIs.
This setting is disabled by default for new and existing orgs. To enable freeze JavaScript prototypes navigates to Setup | Security | Session Settings, then select freeze JavaScript prototypes, once done click on the Save.
5) Token Changes for Formatting Dates in JavaScript API Methods:- Salesforce has changed the list of supported tokens for formatting dates in JavaScript API methods, such as formatDate(), in the AuraLocalizationService object.
Removed Token
The W token, which returned the week of year, is no longer supported. Salesforce still supports the w (lowercase) token, which also returns the week of the year (0 … 53).
Deprecated Tokens
This table maps deprecated tokens to preferred tokens, which you should use for identical formatting.
| Description | Deprecated Token | Preferred Token | Output |
|---|---|---|---|
| Year (four digits) | y | yyyy | 2018 |
| Year (four digits) | Y | yyyy | 2018 |
| Year (two digits) | YY | yy | 18 |
| Year (four digits) | YYYY | yyyy | 2018 |
| AM or PM | A | a | AM or PM |
| Day of month | DD | dd | 01 … 31 |
Note: – You can download release notes in HTML format!, for PDF file.
What are your favorite Winter’19 release note gems?
🍔 🌮 🍪 🍰 I am thankful to Resco.net for sponsoring my blog. 🍔 🌮 🍪 🍰
