Проблемы времени загрузки веб-части Sharepoint Framework

Question

Я столкнулся с некоторыми проблемами во время загрузки веб-части (15 секунд). Я извлекал данные из списка и связывал их с раскрывающимся списком управления в ajax, но у него есть некоторое время ожидания, так как задействован вызов asyn c.

Мне нужна лучшая производительность, как этого можно добиться , может кто-нибудь дать понимание.

function getPackingSites()
{
var packagingSiteUrl = siteAbsUrl + "/_api/web/lists/GetByTitle('"+packingSiteList+"')/Items";
var packagingSiteOptions ="";
$.ajax({
url:packagingSiteUrl,
method: "Get",
async: false,
headers: {
"accept": "application/json;odata=verbose",
},
success: function (PackingSiteData) {
if (PackingSiteData.d.results.length > 0) {
for (var i = 0; i < PackingSiteData.d.results.length; i++) {
packagingSiteOptions += "<option value='"+PackingSiteData.d.results[i].ID+"'>"+PackingSiteData.d.results[i].Title+"</option>";
}
}
},
error: function (x, e) {
alert(e.message.tostring());
}
});
$("#PackingSiteDropdwn").html(packagingSiteOptions);

var tempLink = '<a id="newformSubmit" class="btn offset" href="'+siteAbsUrl+'/pages/Create.aspx?PackSiteID='+$("#PackingSiteDropdwn").val()+'&Source='+siteAbsUrl+'">Submit</a>';
$("#newformSubmitSpan").html(tempLink);
}

}

Answer 1

Есть ли выборка предметов из поиска для вас вариант?

Answer 2

Вы используете вызов syn c для визуализации вашей веб-части, это увеличит время загрузки веб-части.

Я предлагаю вам использовать asyn c data refre sh, вы можете использовать реагирующую среду для этого легко.

Когда веб-часть загружается в первый раз, показывать пользователям информацию о подсказке, такую ​​как «загрузка данных», при возвращении асинхронных c данных вызова отображать фактические данные.

return (      
      <div className={ styles.fileViewCounter }>
        default content
        <div className={ styles.container }>
          <div className={ styles.row }>
            <div className={ styles.column }>              
              <table className="tree">
                <thead>
                    <tr>
                        <th className={styles.THWidth}>Folder/File</th>
                        <th >Views</th>
                        <th >Viewers</th>
                    </tr>
                </thead>                
                { this.state.FileViewResult
                    ? <tbody dangerouslySetInnerHTML={{ __html: this.state.FileViewResult}}></tbody>
                    : <tr><td align={"center"} colSpan={3}>Data Loading...</td></tr>
                 }                
            </table>          
            </div>
          </div>
        </div>
      </div>
    )

Вы можете проверить github samples или моего демонстрационного проекта для asyn c refre sh.