Applies To: SharePoint 2013, 2016, Office 365
List View Client Side Rendering Primer: 1 of 5
About This Series
This series provides a brief overview of Client Side Rendering for List Views (often referred to as JSLink). Basic extension points and examples are included. The goal of this series is to get developers unfamiliar with this programming model quickly up to speed.
- An Introduction to Client Side Rendering ⇐You Are Here
- Benefits of Client Side Rendering
- Getting Started
- List View Extension Points
- Client Side Rendering Best Practices
Client Side Rendering was introduced with SharePoint 2013 and is fully supported in SharePoint 2016 and Office 365.
A Selective History of Drawing Data in SharePoint
SharePoint 2007 incorporated the use of XSLT 1.0 to render list views through XML based web parts such as Content by Query web parts (CQWP) and DataView web parts (DVWP). This allowed developers to customize the display but required specialized knowledge, was very difficult to troubleshoot, and was very poorly documented. This approach is still available in all current versions; however, the usage is not generally recommended.
SharePoint 2010 brought several improvements to XSLT support and Microsoft embraced community sourced documentation. The most important introduction was the new XSLTListView web part that simplified individual list view display and provided a simpler (single stylesheet) usage of XSLT. The XSLTListView web part is still the recommended approach in 2010 and continues to be valid in all current versions.
SharePoint 2016 (and Office 365) have not brought much more for Client Side Rendering. XSLT performance was improved illustrating their understanding of the wide usage of that technology still going forward. However, with the introduction of the new SharePoint Framework (SPFx), many use cases for CSR may be replaced. However, only the web part customization piece of SPFx has been released and only in Office 365 at the time this post was written. However, Microsoft has indicated that the framework will cover many of the other traditionally display template focused areas as well.
JSLink vs Display Templates
At a high-level, CSR can be broken down into two categories: JSLink and Display Templates. Although it is a bit of a misnomer to refer to them separately, the general usage of these terms can be defined as:
- Display Templates
- Templates used in Web Parts using Search
- Property on XSLTListView web parts
The focus of this series is on the use of JSLink in XSLTListView web parts.
Now that you know the basic terms and have an idea of what this CSR/JSLink stuff are, it’s time to find out why you should use it. Check out the next post in this series: