Overview

SharePoint has been serving as a collaboration platform for years now and has offered new features with each of its rollouts. Modern sites in SharePoint are  trending nowadays and offer nice features and usability as compared to the classic sites.

Are you planning to build a new SharePoint intranet from scratch or set up a new site in your existing tenant? A major point to think about is which site to go with -- Classic or Modern?

As we have been working with classic SharePoint sites over the years and we know all possible customization options to handle the business needs, Classic SharePoint site option comes to the mind at first.

Modern sites, on the other hand, offers fewer customization options but offers modern and upgraded user experience for the key SharePoint features.

In this article, we will discuss the advantages and shortfalls of using one over the other.

Classic vs Modern SharePoint


Classic SharePoint is developed on the ASP .Net platform. The requests are sent to server and responses are rendered on the client. That means, as an interaction when a user clicks the entire page postbacks to the server and the server responds back with HTML. These round trips make the user experience much slower. Classic SharePoint offers MDS (Minimal Download Strategy) which reduces page load time by sending only delta changes to the server as a user navigates. The delta changes include a difference between the current page and requested page. However, MDS is very much limited to Team sites and cannot be used effectively with the publishing sites. Also, MDS has its own challenges while rendering our custom JavaScript code.

Modern SharePoint offers Modern UI (Modern User Interface) that are pages based on modern web standards. Modern pages are developed using JavaScript, which renders faster and also offers mobile responsive experience.

Classic SharePoint Development

The typical development in classic SharePoint starts with developing our own custom master page, custom page layouts. With this, we have greater control over the placement of elements and script execution. However, we lose out on the updates to our site for any newer controls being introduced as placeholders through default master page from Microsoft.
Recently, we have been using the concept of JavaScript injection to avoid creating a new master page but still modifying the DOM to alter the site’s overall layout.
Here are a few common practices to be followed:

Master Page

  • Custom master pages are not recommended by Microsoft in SharePoint online and should be avoided.
  • Updates pushed from Microsoft to SharePoint will affect the structure and placement of controls in out of the box master pages.
  • The custom master page will involve additional maintenance and frequent upgrades to match with out of the box.

Page Layouts

  • Definitely, you can have your own page layouts created (as long as they are following the out of box master page placeholders)

Solution Accelerators

  • Many third-party solution accelerators or Office Dev PnP i.e. Patterns and Practices group (https://github.com/SharePoint/PnP) solutions will help you to develop your SharePoint sites quickly.

Development Customizations


  • Classic web parts support JSLink for list/form customizations
  • Display templates offer search result rendering customizations
  • Modern sites do not have a close equivalent to JSLink and Display templates.

Availability of Modern experience

  • Recently classic SharePoint sites offer Modern UI for list/library, site content pages.
  • We can switch back and forth between the classic and modern experience.

The mix of classic and modern experience

  • We can have an intranet home site in the classic experience (as of now, Microsoft does not offer an option to recreate root site with the modern experience)
  • Other site collections can be built using the modern experience.
  • This kind of mixed experience might be confusing to the users.

Modern SharePoint Development


The modern Communication and Team templates offer to quickly create out of box responsive and modern experience sites (or rather site collections). Each modern site is a separate site collection itself under /sites managed path.

Here are few points to consider,

Master Page and Page Layout Customizations

  • Modern sites do not support custom master pages and custom page layouts.
  • The out of the box available page layouts are limited but can suffice for the purpose.

Responsive out of the box

  • Modern sites are responsive out of the box as well the modern web parts support responsiveness.

Solution Accelerators

  • Office Dev PnP is in the process of rolling out the solution accelerators for modern sites

Hub sites

  • SharePoint is rolling out hub sites experience, which will help to connect to the number of site collections and pull the data as navigation, shared theme,  and news roll-up. Also, it offers searching across all sites in the hub.

Development Customizations

  • The development is client side using JavaScript frameworks like Angular JS, React JS.
  • The custom web parts are developed as SPFx (SharePoint Framework) web parts.
  • SPFx extensions can help for Application Customizers, Field Customizers, and Command Sets.

Summary


Classic and Modern sites have their own advantages and shortfalls. But for those who are starting to build new sites in SharePoint, I will encourage you to go to Modern sites unless you have any business constraints. Modern sites are the future of SharePoint, which provides the best user experience.