Compartir a través de


Mejora del rendimiento en complementos hospedados por el proveedor de SharePoint

Puede mejorar el rendimiento del complemento hospedado por el proveedor de SharePoint limitando el número y la frecuencia de las llamadas remotas a SharePoint. Demasiadas llamadas al sitio host degradan el rendimiento. Para limitar el número de llamadas remotas, puede implementar cookies HTTP o almacenamiento local HTML5.

El ejemplo Performance.Caching muestra cómo usar cookies HTTP y almacenamiento local HTML5 para almacenar en caché los datos. El ejemplo incluye dos complementos hospedados por el proveedor que le permiten ver la sección Acerca de mí del perfil de usuario, agregar datos y guardarlos para más adelante. El complemento no actualiza la información del perfil de usuario; lo almacena en caché para que se pueda usar más adelante.

Un ejemplo usa cookies HTTP para almacenar en caché los datos y el otro usa almacenamiento local HTML5.

Uso de cookies HTTP para el almacenamiento en caché

La página de inicio del ejemplo de cookies HTTP muestra información de la sección Acerca de mí del perfil de usuario en un cuadro de texto. Un segundo cuadro de texto indica si se creó una nueva cookie y cuándo expirará la cookie existente. La información almacenada en las cookies no puede superar los 4095 bytes.

Datos representados en el ejemplo de almacenamiento en caché de cookie HTTP

Datos representados en el ejemplo de almacenamiento en caché de cookie HTTP

El archivo app.js, que se encuentra en la carpeta Scripts del proyecto web, define el comportamiento del botón Guardar para más adelante . El código comprueba primero que las cookies están habilitadas en el explorador estableciendo una cookie de prueba. Si las cookies están habilitadas, el código determina si la información del perfil de usuario ya está almacenada en una cookie. Si no es así, usa JSON para buscar la información acerca de , almacenarla en una cookie y, a continuación, mostrar la información en el explorador.

La siguiente función establece la cookie y su fecha de expiración.

function setCookie(key, value, expiry, path, domain, secure) {
    var todaysDate = new Date();
    todaysDate.setTime(todaysDate.getTime());

    if (expiry == "") { expiry = "1"; }

    // The following line sets for n number of days. For hours, remove * 24. For minutes, remove * 60 * 24.
    if (expiry) {
        expiry = expiry * 1000 * 60 * 60 * 24;
    }

    var newExpiry = new Date(todaysDate.getTime() + (expiry));

    document.cookie = key + "=" + escape(value) +
        ( ( expiry ) ? ";expires=" + newExpiry : "" ) +
        ( ( path ) ? ";path=" + path : "" ) +
        ( ( domain ) ? ";domain=" + domain : "" ) +
        ((secure) ? ";secure" : "");

    cachingStatus += "\n" + "Creating http cookie for AboutMe data...";
    cachingStatus += "\n" + "Cookie will expire " + newExpiry;
    $('#status').text(cachingStatus);
}

Uso del almacenamiento local HTML5 para el almacenamiento en caché

La página de inicio del ejemplo de almacenamiento local HTML5 muestra información de la sección Acerca de mí de la información del perfil de usuario sobre los datos almacenados en caché. El cuadro de texto muestra esta información, así como el tiempo de expiración (si existe) de la información almacenada en caché.

El archivo app.js, que se encuentra en la carpeta Scripts del proyecto web, define el comportamiento del botón Guardar para más adelante . En primer lugar, el complemento comprueba que el almacenamiento local está habilitado mediante la siguiente función.

isHtml5StorageSupported = function () {
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch (e) {
        return false;
    }
    return false;
}


Si se admite el almacenamiento local, la función determina si la información del perfil de usuario ya está almacenada allí. Si no es así, usa JSOM para buscar la información acerca de , almacenarla localmente y, a continuación, mostrar la información en el explorador. El código siguiente almacena la información acerca de mí en una clave denominada aboutMeValue.

var aboutMeValue = personProperties.get_userProfileProperties()['AboutMe'];
    $('#aboutMeText').val(aboutMeValue);

    // Add to local storage.
    localStorage.setItem("aboutMeValue", aboutMeValue);
    setLocalStorageKeyExpiry("aboutMeValue");

    cachingStatus += "\n" + "Populated local storage with profile properties...";
    $('#status').val(cachingStatus);


El botón Borrar la memoria caché quita esa clave, busca la información acerca de mí en el perfil de usuario y crea una clave de almacenamiento local nueva para almacenar esa información. El complemento no establece una hora de expiración de forma predeterminada, pero el archivo app.js contiene la siguiente función, que establece un tiempo de expiración para los datos almacenados en caché.

function setLocalStorageKeyExpiry(key) {

    // Check for expiration config values.
    var expiryConfig = localStorage.getItem(expiryConfigKey);
    
    // Check for existing expiration stamp.
    var existingStamp = localStorage.getItem(key + expiryKeySuffix);    

    // Override cached setting if a user has entered a value that is different than what is stored.
    if (expiryConfig != null) {
                
        var currentTime = Math.floor((new Date().getTime()) / 1000);
        expiryConfig = parseInt(expiryConfig);
        
        var newStamp = Math.floor((currentTime + expiryConfig));
        localStorage.setItem(key + expiryKeySuffix, newStamp);
        
        // Log status to window.        
        cachingStatus += "\n" + "Setting expiration for the " + key + " key...";
        $('#status').val(cachingStatus);
    }    
    else {
       
    }
}

Antes de buscar la información almacenada en la clave de almacenamiento local, el código usa la función isKeyExpired para determinar si la clave ha expirado. Para obtener más información, vea Personalizar la experiencia de usuario mediante complementos hospedados por el proveedor de SharePoint.

Vea también