Modificar los componentes de SharePoint para MDS

Obtenga información sobre cómo modificar los componentes del proyecto de SharePoint para aprovechar la estrategia de descarga mínima (MDS) en SharePoint. Estrategia de descarga mínima (MDS) mejora la experiencia del usuario devolviendo desde el servidor sólo las partes de una página necesarios para representarlo correctamente en el explorador. Dado que la página totalmente representada no se devuelve al cliente, el servidor debe identificar con precisión las partes necesarias para representar la página. Es posible que tenga que modificar los componentes del proyecto de SharePoint para que se identifiquen como compatibles con MDS y puedan trabajar con el motor MDS. Obtenga más información sobre MDS en Información general sobre la estrategia de descarga mínima.

¿Por qué modificar componentes SharePoint ?

Como se explica en La introducción a la estrategia de descarga mínima, los controles de SharePoint funcionan tanto si los modifica como si no para aprovechar al máximo MDS. Sin embargo, cuando los componentes no son compatibles con MDS, el motor mds emite una conmutación por error. En una conmutación por error, el motor de MDS toma un ida y vuelta adicional para redirigir el explorador a la versión completa de la nueva página, que toma tiempo. Los usuarios tienen la mejor experiencia al modificar componentes para trabajar con MDS y para evitar una conmutación por error cada vez vaya a una página nueva en SharePoint. Normalmente, debe modificar páginas maestras, páginas ASP.NET, controles y elementos web.

Páginas principales

La página maestra proporciona una plantilla que permite a MDS a identificar las áreas de contenido que pueden que necesiten actualizarse cuando un usuario navega a una nueva página. La optimización de la página maestra es uno de los pasos más importantes a seguir al optimizar el rendimiento, ya que las páginas maestras identifican secciones que requieren contenido actualizado. La página Seattle.master incluida con SharePoint es un buen ejemplo de una página maestra optimizada. En la figura 1 se muestran ejemplos de componentes de la página maestra de Seattle.master que cambian de una página a otra, como el área de contenido principal (1), la barra de navegación izquierda (2) y el título de la página (3).

. Componentes que requieren actualizaciones en una página maestra

Existen diferentes patrones para optimizar los componentes en una página maestra. Puede usar un modelo para los siguientes componentes:

• Controles y regiones HTML
• Hojas de estilos
• Archivos de JavaScript
• Título de página

Las regiones y los controles HTML son compatibles con MDS si están encapsulados en <SharePoint:AjaxDelta> etiquetas. Al encapsular el contenido en <SharePoint:AjaxDelta> etiquetas, está señalando que el motor MDS debe actualizar los controles y HTML incluidos. Si un control o una sección HTML no cambian de página en página, no se debe enviar al cliente. Por lo tanto, debe mantener estos controles fuera de <AjaxDelta> las etiquetas. En la página maestra Seattle.master que se muestra en la figura 1, el área de contenido principal (1) se encapsula en <AjaxDelta> etiquetas, como se muestra aquí.

<SharePoint:AjaxDelta
      id="DeltaPlaceHolderMain"
      BlockElement="true"
      IsMainContent="true"
      runat="server">
  <a id="mainContent" name="mainContent" tabindex="-1"></a>
  <asp:ContentPlaceHolder id="PlaceHolderMain" runat="server" />
</SharePoint:AjaxDelta>

Otro ejemplo del <AjaxDelta> patrón es la barra de navegación izquierda (2) de la figura 1. En el código siguiente se muestra cómo el control se encapsula en <AjaxDelta> etiquetas junto con muchos otros controles y HTML.

<SharePoint:AjaxDelta
      id="DeltaPlaceHolderLeftNavBar"
      BlockElement="true"
      CssClass="ms-core-navigation"
      role="navigation"
      runat="server">
  <asp:ContentPlaceHolder id="PlaceHolderLeftNavBar" runat="server">
    <a id="startNavigation" name="startNavigation" tabIndex="-1"></a>
    <asp:ContentPlaceHolder id="PlaceHolderLeftNavBarTop" runat="server" />
    <asp:ContentPlaceHolder id="PlaceHolderQuickLaunchTop" runat="server" />
    <asp:ContentPlaceHolder id="PlaceHolderLeftNavBarDataSource" runat="server" />
    <asp:ContentPlaceHolder id="PlaceHolderCalendarNavigator" runat="server" />
    <asp:ContentPlaceHolder id="PlaceHolderLeftActions" runat="server" />
    <!-- There are more controls and HTML in this placeholder in the Seattle master page -->
  </asp:ContentPlaceHolder>
</SharePoint:AjaxDelta>

Una última cosa que hay que recordar sobre <AjaxDelta> las etiquetas es que no se pueden anidar. Debe especificar <AjaxDelta> etiquetas en el nivel más alto necesario en la estructura de la página maestra.

El último ejemplo de la figura 1 es el título de página (3), que requiere un patrón especial que use la <SharePoint:PageTitle> etiqueta . En el código siguiente se muestra la <PageTitle> etiqueta como se usa en la página maestra Seattle.master.

<SharePoint:PageTitle runat="server">
  <asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server">
    <SharePoint:ProjectProperty Property="Title" runat="server" />
  </asp:ContentPlaceHolder>
</SharePoint:PageTitle>

La página maestra también puede incluir hojas de estilo y archivos de JavaScript. El motor de servidor necesita identificar los archivos CSS y JavaScript según sea necesario. Para identificar los recursos de archivos CSS según sea necesario, use el siguiente patrón.

<SharePoint:CssLink runat="server" Version="15"/>
<SharePoint:CssRegistration Name="my_styles.css" runat="server" />

Solo puede tener una <CssLink> etiqueta por página maestra, pero puede tener muchas <CssRegistration> etiquetas, por lo que puede agregar muchos archivos CSS. Use el siguiente patrón para los archivos de JavaScript.

<SharePoint:ScriptLink language="javascript" name="my_javascript.js" runat="server" />

No se admite la inclusión de archivos CSS y JavaScript con HTML <style> y <script> etiquetas en MDS.

Páginas ASP.NET

Si el proyecto incluye páginas ASP.NET, probablemente necesite hacer referencia a archivos CSS y JavaScript. El CÓDIGO HTML <style> y <script> las etiquetas no son compatibles con MDS. En su lugar, use los <CssRegistration> patrones y <ScriptLink> explicados en la sección anterior.

Las páginas de ASP.NET también pueden usar el Response.Output método para escribir contenido en la página, lo que no está permitido en MDS. En su lugar, puede usar los siguientes métodos compatibles con MDS de la clase SPHttpUtility :

• WriteNoEncode()
• WriteHtmlEncode()
• WriteEcmaScriptStringLiteralEncode()
• WriteHtmlEncodeAllowSimpleTextFormatting()
• WriteHtmlUrlAttributeEncode()
• WriteUrlKeyValueEncode()
• WriteUrlPathEncode()

Además de hacer referencia a archivos de JavaScript, las páginas de ASP.NET pueden tener el código JavaScript en línea. Use el siguiente patrón para realizar la secuencia de comandos bloquea MDS compatible.

<SharePoint:ScriptBlock runat="server" >
  // Your JavaScript code here.
</SharePoint:ScriptBlock>

Controles y elementos web

También debe marcar los controles y los elementos web como compatibles con MDS. El siguiente código muestra el patrón que se utiliza.

[assembly: Microsoft.SharePoint.WebControls.MdsCompliantAttribute(IsCompliant = true)]
namespace VisualWebPartProject2.VisualWebPart1
{
  // Rest of your control logic

Además, los controles y los elementos web deben registrar sus recursos mediante los métodos de la clase SPPageContentManager . Los recursos más comunes son fragmentos de código de JavaScript y archivos ocultos, que se pueden registrar mediante y <RegisterClientScriptBlock><RegisterHiddenField>, respectivamente.

Los controles y los elementos web también pueden usar archivos XSLT para controlar el proceso de representación. Los archivos XSLT pueden tener incrustados JavaScript código o archivos. El motor de MDS necesita saber acerca de estos recursos. Puede registrar los recursos de JavaScript mediante un objeto de extensión XSLT denominado pcm. Un gran ejemplo de cómo usar el pcm objeto se encuentra en el archivo %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\15\TEMPLATE\LAYOUTS\XSL\fldtypes.xsl. En el código siguiente se muestra cómo el archivo fldtypes.xsl usa el pcm objeto para registrar recursos de JavaScript.

<xsl:value-of select="pcm:RegisterScriptBlock(concat('block1',$ViewCounter), string($scriptbody1))"/>
<xsl:value-of select="pcm:RegisterScriptLink('/_layouts/15/wssactionmenu.js')"/>

Vea también

• Información general de estrategia de descarga mínima
• Crear sitios para SharePoint