خيارات التنقل ل SharePoint Online

هام: تمت ترجمة هذه المقالة ترجمة آلية، راجع إقرار إخلاء المسؤولية. يرجى الاطلاع على النسخة الإنجليزية من هذه المقالة. هنا للرجوع إليها.

تصف هذه المقاله كيفيه تحسين اوقات تحميل صفحات ل SharePoint Online ب# استخدام التنقل الهيكلي و# التنقل التي تعتمد علي البحث.

يمكنك جعل الاستعلامات المطلوبه ل# انشاء التنقل الهيكلي و# التنقل العمومي صفحاتك تحميل مزيد من بطء في SharePoint Online. هذا نظرا ل# ان كل من هذه الاستعلامات ارسال طلب اخر ب SQL server. ل# كل المواقع و# الموقع الفرعي المتوفره لديك، يتم اجراء المزيد من طلبات ب SQL server. تؤثر هذه المشكله ايضا علي الصفحات الرئيسيه. ف# هذا يعني ان ايضا تاثر التنقل العمومي.

تتطلب بعض المواقع SharePoint بني كبيره و# معقده. يؤدي استخدام التنقل الهيكلي خارج من المربع، الذي يستخدم المحتوي ب# الاستعلام، يمكنك اوقات تحميل صفحات بطيئا سبب طبقات مواقع متعدده. كل من الطبقات ل# المواقع الفرعيه ايضا ب# انشاء استعلام اخر.

يتوفر خياران التنقل خارج من مربع الرئيسيه في SharePoint ب# الاضافه الي اخري، و# الطريقه المخصصه، و# التي تعتمد علي البحث. يتضمن كل خيار محترفي تقنيات المعلومات و# اتصالات كما هو موضح في الجدول التالي.

التنقل الهيكلي

التنقل المدار

التنقل التي تعتمد علي البحث

محترفي تقنيات المعلومات:

  • سهله ل# تكوين

  • اقتطاع الامان

  • تحديث كما تتم اضافه مواقع تلقائيا

محترفي تقنيات المعلومات:

  • ب# الاحتفاظ ب# سهوله

محترفي تقنيات المعلومات:

  • اقتطاع الامان

  • تحديث كما تتم اضافه مواقع تلقائيا

  • سرعه تحميل بنيه التنقل الوقت و# محليا المخزنه مؤقتا

اتصالات:

  • يمكنك القيام ب# شكل غير جيد مع بنيه موقع معقده

اتصالات:

  • تحديث تلقائيا ل# تعكس بنيه الموقع

اتصالات:

  • لم القدره علي مواقع امر ب# سهوله

  • يتطلب تخصيص الصفحه الرئيسيه (التقنيه المهارات المطلوبه)

اذا كان لديك موقع ب# استخدام عدد كبير من المواقع الفرعيه و# التنقل الهيكلي الذي تستخدمه، ف# قد تكون ابطاء تحميل علي الصفحه ل# اسفل الي حد كبير. تعتمد الخيار الاكثر ملاءمه ل# الموقع الخاص بك علي متطلبات الموقع الخاص بك و# علي امكانيه التقنيه الخاصه بك. اذا كنت تشعر ب# استخدام صفحه رئيسيه مخصصه و# كان جزء من امكانيه في المؤسسه الاحتفاظ ب# التغييرات التي قد تحدث في الصفحه الرئيسيه ل SharePoint Online، ثم الخيار التي تعتمد علي البحث انتاج الحصول علي افضل تجربه المستخدم. اذا اردت الارض الاوسط بسيط بين التنقل الهيكلي--المضمنه و# البحث، ثم التنقل المدار خيار جيد جدا. يمكن المحافظه علي الخيار التنقل المدار من خلال تكوين، لا يتضمن ملفات تخصيص التعليمات البرمجيه، كما انها اسرع الي حد كبير من التنقل الهيكلي خارج من مربع.

هو اسلوب اخر ل# اعاده هيكله الموقع الموجود و# تقليل عدد عناصر التنقل و# مواقع فرعيه مطلوب. هذا ل# ان ينفذ التنقل الهيكلي ايضا طالما بنيه الموقع و# التنقل غير معقدا.

تقارن هذه المقاله الطرق المختلفه في مجموعه مواقع مشتركه ل# مثال. المواقع الفرعيه 11 يحتوي علي مجموعه المواقع المشتركه النموذجيه، و# موقع ويب الفرعي كل المواقع الفرعيه اضافيه علي الاقل الاربعه.

لقطة شاشة تعرض مواقع ومواقع فرعية

استخدام التنقل الهيكلي في SharePoint Online

هذا هو جزء التنقل خارج من مربع المستخدمه ب# شكل افتراضي و# الحلول الاكثر امرا بسيطا و# المناسبه في معظم الحالات. ما لم يكن هناك بنيه معقده من عده مواقع فرعيه او عده مستويات من المواقع الفرعيه، ينفذ التنقل الهيكلي ايضا. يتم اهم ميزات استخدام هذا الاسلوب هو اقتطاع الامان، و# يتم تحديث تلقائيا عند اضافه مواقع جديده و# لا يتطلب اي تخصيص الصفحه الرئيسيه. مستخدم غير تقنيه يمكنك ايضا ب# سهوله اضافه عناصر و# اخفاء العناصر و# اداره التنقل من صفحه "اعدادات".

يؤدي تشغيل ميزه التنقل الهيكلي في SharePoint Online

ل# توضيح كيفيه موقع فرعي ل# الاداء في حل SharePoint Online قياسيه ب# استخدام التنقل الهيكلي و# اظهار الخيار قيد التشغيل. ادناه هو لقطه شاشه اعدادات في الصفحه اعدادات الموقع > التنقل.

لقطة شاشة تعرض مواقع فرعية

تحليل اداء بنيه التنقل في SharePoint Online

ل# تحليل اداء صفحه SharePoint استخدم علامه التبويب الشبكه ادوات المطور F12 في Internet Explorer.

لقطة شاشة تعرض أدوات المطوِّرين F12 ضمن علامة التبويب "شبكة"

علي علامه التبويب الشبكه، انقر فوق الصفحه .aspx التي يتم تحميل، ثم فوق علي علامه التبويب التفاصيل.

لقطة شاشة تعرض علامة التبويب "تفاصيل"

انقر فوق رؤوس الاستجابه.

لقطة شاشة لعلامة التبويب "تفاصيل"

ارجاع SharePoint بعض معلومات تشخيصيه مفيده في رؤوس الاستجابه الخاص به. من مفيده جدا هي SPRequestDuration    و# هي القيمه، ل# مده طلب استغرقتها معالجه علي الخادم بالمللي ثانيه.

في عرض المواقع الفرعيه لقطه الشاشه التاليه غير محدده ل# التنقل الهيكلي. ف# هذا يعني ان هناك ارتباط مجموعه الموقع فقط في شريط التنقل العمومي:

لقطة شاشة تبيّن أوقات التحميل كمدة الطلب

المفتاح SPRequestDuration    قيمه 245 بالمللي ثانيه. يمثل هذا الوقت المستغرق ل# ارجاع الطلب. ب# ما ان هناك عنصر واحد فقط في التنقل في الموقع، هذه ارشاديه جيده عن كيفيه SharePoint Online تنفيذ دون التنقل كثيف. تعرض لقطه الشاشه التاليه كيفيه اضافه في المواقع الفرعيه علي هذا المفتاح.

لقطة شاشة تعرض مدة طلب مدتها 2502 مللي ثانية

اضافه المواقع الفرعيه يحتوي علي زياده الوقت المستغرق ل# ارجاع طلب الصفحه ب# شكل ملحوظ.

فوائد استخدام جزء التنقل مصنفه العاديه هي ان يمكنك ب# سهوله تنظيم الترتيب، و# اخفاء المواقع، و# اضافه الصفحات، و# النتائج اقتطاع الامان، و# هي لا ديفياتينج من الصفحات الرئيسيه المعتمده المستخدمه في SharePoint Online. اذا قمت ب# تنظيم موقعك ب# عنايه و# تقليل عدد المواقع الفرعيه في مجموعه المواقع المشتركه ثم التنقل الهيكلي ينفذ ايضا.

استخدام التنقل المدار و# بيانات التعريف المداره في SharePoint Online

التنقل المدار هو خيار اضافه مستخدمين من مربع اخر التي يمكنك استخدامها ل# اعاده انشاء نفس نوع وظيفه التنقل الهيكلي.

تتمثل فائده استخدام بيانات التعريف المداره انها اسرع ل# استرداد البيانات من استخدام المحتوي حسب الاستعلام الي بنيه التنقل داخل الموقع. علي الرغم من انه اسرع لا توجد ايه طريقه ل# الامان trim النتائج وب# التالي اذا لم يكن مستخدم الوصول الي موقع معين، الارتباط لا تزال ستعرض و# لكن يؤدي الي رساله خطا.

كيفيه تنفيذ تنقل مدار والنتائج   

هناك عده مقالات علي TechNet حول تفاصيل التنقل المدار، علي سبيل المثال، راجع نظره عامه حول التنقل المدار في SharePoint Server 2013.

ل# كي تتمكن من تنفيذ التنقل المدار، يجب ان تتوفر لديك مصطلح تخزين اذونات المسؤول. ب# اعداد شروط مع عناوين Url التي تتطابق مع بنيه مجموعه مواقع مشتركه، يمكنك استخدام التنقل المدار ل# استبدال التنقل الهيكلي. علي سبيل المثال:

لقطة شاشة لمثال الموقع الفرعي1

يوضح المثال التالي اداء بنيه التنقل معقده استخدام التنقل المدار.

لقطة شاشة لمثال SPRequestDuration

استخدام التنقل المدار طريقه متناسقه الي تحسين اداء مقارنه ب# المحتوي ب# اتجاه التنقل الهيكلي الاستعلام.

استخدام البرمجه النصيه العميل التي تعتمد علي البحث

استخدام ميزه البحث يمكنك زياده فعاليه الفهارس التي تم انشاؤها في الخلفيه ب# استخدام التسجيل المستمر في الفهرس. هذا يعني انه لا لا يوجد استعلامات محتوي كثيف. يتم سحبه نتائج البحث من فهرس البحث و# النتائج اقتطاع الامان. هذا اسرع من استخدام الاستعلامات المحتوي العاديه. استخدام ميزه البحث ل# التنقل الهيكلي، خاصه اذا كان لديك بنيه موقع معقده، سيتم زياده سرعه تحميل الوقت الي حد كبير الصفحه. الميزه الرئيسيه في هذه عبر التنقل المدار هي يمكنك الاستفاده من اقتطاع الامان.

يتضمن هذا الاسلوب انشاء صفحه رئيسيه مخصصه و# استبدال التعليمه البرمجيه ل# اضافه مستخدمين من مربع التنقل ب# تنسيق HTML مخصصه. متابعه هذا الاجراء ل# استبدال التعليمه البرمجيه ل# التنقل في seattle.html الملف.

في هذا المثال، سيتم فتح الملف seattle.html و# استبدال العنصر كامله المعرف = "DeltaTopNavigation" مع التعليمه البرمجيه HTML مخصصه.

مثال: ل# استبدال التعليمه البرمجيه ل# اضافه مستخدمين من مربع التنقل في صفحه رئيسيه
  1. انتقل الي صفحه اعدادات الموقع.

  2. فتح معرض الصفحات الرئيسيه ب# النقر فوق صفحات رئيسيه.

  3. من هنا يمكنك التنقل عبر المكتبه و# قم ب# تنزيل ملف seattle.master.

  4. تحرير التعليمه البرمجيه ل# استخدام محرر نص و# حذف كتله التعليمات البرمجيه في لقطه الشاشه التاليه.

    لقطة شاشة لرمز DeltaTopNavigation لحذفه
  5. ازاله التعليمات البرمجيه بين < معرف SharePoint:AjaxDelta = "DeltaTopNavigation" > و# < \SharePoint:AjaxDelta > و# العلامات و# استبدالها ب# الاجزاء التاليه:

    <div id="loading">
      <!--Replace with path to loading image.-->
      <div style="background-image: url(''); height: 22px; width: 22px; ">
      </div>
    </div>
    <!-- Main Content-->
    <div id="navContainer" style="display:none">
      <div data-bind="foreach: hierarchy" class="noindex ms-core-listMenu-horizontalBox">
        <ul id="menu" data-bind="foreach: $data.children" style="padding-left:20px">
          <li class="static dynamic-children">
            <a class="static dynamic-children menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" data-bind="attr: { href: item.Url, title: item.Title }">
              <span aria-haspopup="true" class="additional-background ms-navedit-flyoutArrow dynamic-children">
                <span class="menu-item-text" data-bind="text: item.Title">
                </span>
              </span>
            </a>
            <ul id="menu" data-bind="foreach: children" class="dynamic">
              <li class="dynamic">
                <a class="dynamic menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" data-bind="attr: { href: item.Url, title: item.Title }">
                  <span class="menu-item-text" data-bind="text: item.Title">
                  </span>
                </a>
              </li>
            </ul>
          </li>
        </ul>
      </div>
    </div>
  6. استبدال عنوان URL في التحميل صوره علامه الارتساء في البدايه مع ارتباط الي صوره تحميل في مجموعه المواقع المشتركه. بعد اجراء التغييرات، اعاده تسميه الملف و# قم ب# تحميله الي معرض الصفحات الرئيسيه. يقوم هذا ب# انشاء ملف رئيسي جديد.

  7. HTML به العلامات الاساسيه الذي تتم تعبئته ب# نتائج البحث التي يتم ارجاعها من التعليمات البرمجيه ل JavaScript. ستحتاج الي تحرير التعليمه البرمجيه التاليه ل# تغيير قيمه var root = “site collection URL كما هو موضح في جزء التعليمات البرمجيه التاليه:

    var root = “https://spperformance.sharepoint.com/sites/NavigationBySearch”;

    ملف JavaScript ب# اكمله كما يلي:

    //Models and Namespaces
    var SPO = SPO || {};
    SPO.Models = SPO.Models || {}
    SPO.Models.NavigationNode = function () {
    
        this.Url = ko.observable("");
        this.Title = ko.observable("");
        this.Parent = ko.observable("");
    
    };
    
    var root = "https://spperformance.sharepoint.com/sites/NavigationBySearch";
    var baseUrl = root + "/_api/search/query?querytext=";
    var query = baseUrl + "'contentClass=\"STS_Web\"+path:" + root + "'&trimduplicates=false&rowlimit=300";
    
    var baseRequest = {
        url: "",
        type: ""
    };
    
    //Parses a local object from JSON search result.
    function getNavigationFromDto(dto) {
        var item = new SPO.Models.NavigationNode();
        if (dto != undefined) {
    
            item.Title(dto.Cells.results[3].Value);
            item.Url(dto.Cells.results[6].Value);
            item.Parent(dto.Cells.results[19].Value);
        }
    
        return item;
    }
    //Parse a local object from the serialized cache.
    function getNavigationFromCache(dto) {
        var item = new SPO.Models.NavigationNode();
    
        if (dto != undefined) {
    
            item.Title(dto.Title);
            item.Url(dto.Url);
            item.Parent(dto.Parent);
        }
    
        return item;
    }
    
    /* create a new OData request for JSON response */
    function getRequest(endpoint) {
        var request = baseRequest;
        request.type = "GET";
        request.url = endpoint;
        request.headers = { ACCEPT: "application/json;odata=verbose" };
        return request;
    };
    /* Navigation Module*/
    function NavigationViewModel() {
        "use strict";
        var self = this;
        self.nodes = ko.observableArray([]);
        self.hierarchy = ko.observableArray([]);;
        self.loadNavigatioNodes = function () {
            //Check local storage for cached navigation datasource.
            var fromStorage = localStorage["nodesCache"];
            if (false) {
                var cachedNodes = JSON.parse(localStorage["nodesCache"]);
                var timeStamp = localStorage["nodesCachedAt"];
                if (cachedNodes && timeStamp) {
                    //Check for cache expiration. Currently set to 3 hrs.
                    var now = new Date();
                    var diff = now.getTime() - timeStamp;
                    if (Math.round(diff / (1000 * 60 * 60)) < 3) {
    
                        //return from cache.
                        var cacheResults = [];
                        $.each(cachedNodes, function (i, item) {
                            var nodeitem = getNavigationFromCache(item, true);
                            cacheResults.push(nodeitem);
                        });
    
                        self.buildHierarchy(cacheResults);
                        self.toggleView();
    addEventsToElements();
                        return;
                    }
                }
            }
            //No cache hit, REST call required.
            self.queryRemoteInterface();
        };
    //Executes a REST call and builds the navigation hierarchy.
        self.queryRemoteInterface = function () {
            var oDataRequest = getRequest(query);
            $.ajax(oDataRequest).done(function (data) {
                var results = [];
                $.each(data.d.query.PrimaryQueryResult.RelevantResults.Table.Rows.results, function (i, item) {
    
                    if (i == 0) {
                        //Add root element.
                        var rootItem = new SPO.Models.NavigationNode();
                        rootItem.Title("Root");
                        rootItem.Url(root);
                        rootItem.Parent(null);
                        results.push(rootItem);
                    }
                    var navItem = getNavigationFromDto(item);
                    results.push(navItem);
                });
                //Add to local cache
                localStorage["nodesCache"] = ko.toJSON(results);
                localStorage["nodesCachedAt"] = new Date().getTime();
                self.nodes(results);
                if (self.nodes().length > 0) {
    var unsortedArray = self.nodes();
    var sortedArray = unsortedArray.sort(self.sortObjectsInArray);
                    self.buildHierarchy(sortedArray);
                    self.toggleView();
    addEventsToElements();
                }
            }).fail(function () {
                //Handle error here!!
                $("#loading").hide();
                $("#error").show();
            });
        };
    self.toggleView = function () {
            var navContainer = document.getElementById("navContainer");
            ko.applyBindings(self, navContainer);
            $("#loading").hide();
            $("#navContainer").show();
    
        };
        //Uses linq.js to build the navigation tree.
        self.buildHierarchy = function (enumerable) {
    
            self.hierarchy(Enumerable.From(enumerable).ByHierarchy(function (d) {
                return d.Parent() == null;
            }, function (parent, child) {
                if (parent.Url() == null || child.Parent() == null)
                    return false;
                return parent.Url().toUpperCase() == child.Parent().toUpperCase();
            }).ToArray());
        };
    self.sortObjectsInArray = function (a,b){
    if (a.Title() > b.Title())
    return -1;
        if (a.Title() < b.Title())
    return 1;
        return 0;
    }
    }
    //Loads the navigation on load and binds the event handlers for mouse interaction.
    $(document).ready(function () {
        "use strict";
        var viewModel = new NavigationViewModel();
        viewModel.loadNavigatioNodes();
    });
    function addEventsToElements(){
        //events.
        $("li.dynamic-children").mouseover(function () {
            var position = $(this).position();
            $(this).find("ul").css({ width: 125, left: position.left + 10, top: 50 });
    
        })
    .mouseout(function () {
      $(this).find("ul").css({ width: 0, left: -99999, top: 0 });
     });
    }
    
    

    ل# تلخيص الرمز الموضح اعلاه في الداله .ready $(مستند)    jQuery هناك كائن فيوموديل التي تم انشاؤها و# ثم يسمي الداله loadNavigationNodes()    علي هذا الكائن. هذه الداله اما تحميل التسلسل الهيكلي ل# التنقل الذي تم انشاؤه مسبقا المخزنه في تخزين مستعرض العميل المحلي HTML5 او تستدعي الداله queryRemoteInterface()   .

    تستخدم ل# انشاء طلب استخدام الداله getRequest()    مع معلمه الاستعلام المعرفه مسبقا في البرنامج النصي QueryRemoteInterface()    و# ثم ارجاع البيانات من الخادم. هذه البيانات عباره عن صفيف من كل المواقع في مجموعه المواقع المشتركه تمثيلها ك# كائنات نقل البيانات ب# استخدام خصائص المتنوعه ب# شكل اساسي. يتم تحليلها هذه البيانات الي SPO المعرفه مسبقا. كائنات Models.NavigationNode استخدامه Knockout.js ل# انشاء خصائص ملحوظه ل# الاستخدام ب# ربط القيم الي HTML الذي تم تحديده في وقت سابق البيانات. ثم يتم وضع الكائنات في صفيف نتائج. يتم تحليل الي JSON استخدام دفع هذا الصفيف و# تخزينها في تخزين المستعرض المحلي ل# تحسين الاداء علي عمليات تحميل الصفحات المستقبليه.

  8. بعد ذلك، علي النتائج التي تم تعيينها الي الصفيف self.nodes و# انشاء تسلسل هيكلي الخروج من الكائنات استخدام linq.js يؤدي تعيين الاخراج ل# self.heirarchy صفيف. قيمه الصفيف هذا الكائن المرتبط HTML. يتم اجراء ذلك في الداله toggleView()    ب# تمرير الكائن الذاتيه ل# الداله ko.applyBinding()    . يؤدي هذا ثم الصفيف التسلسل الهيكلي ربط ب# تنسيق HTML ما يلي:

    <div data-bind=”foreach: hierarchy” class=”noindex ms-core-listMenu-horizontalBox”>

    و# اخيرا، تتم اضافه معالجات الاحداث ل mouseenter و# موسيكسيت الي جزء التنقل المستوي الاعلي ل# التعامل مع القوائم المنسدله الموقع الفرعي الذي يتم اجراؤه في الداله addEventsToElements()    .

    يمكن رؤيتها علي النتائج من جزء التنقل في لقطه الشاشه ادناه:

    لقطة شاشة لنتائج التنقل

    في مثالنا التنقل معقده صفحه جديده التحميل دون اظهار التخزين المؤقت المحليه الوقت المنقضي علي الخادم الذي يحتوي علي تم قص من التنقل الهيكلي قياس الاداء ل# الحصول علي نتيجه مماثله ك# الاسلوب التنقل المدار.

    لقطة شاشة لـ SPRequestDuration 301

    واحد الفوائد الرئيسيه ل# هذا الاسلوب هو ان ب# استخدام التخزين المحلي HTML5، التنقل يتم تخزين محليا ل# المستخدم في المره التاليه التي تحميل الصفحه.

نحن الحصول علي تحسين الاداء الرئيسيه من استخدام ميزه البحث API ل# التنقل الهيكلي؛ و# مع ذلك، تتطلب بعض التقنيه امكانيه تنفيذ و# تخصيص هذه الوظيفه. في تطبيق المثال، يتم ترتيب المواقع ب# الطريقه نفسها ك# التنقل الهيكلي خارج من مربع؛ ترتيب ابجدي. اذا اردت ان التخلي عن هذا الامر، ف# سيكون اكثر تعقيدا ل# تطوير و# الاحتفاظ بها. ايضا، هذا الاسلوب يتطلب التخلي عن الصفحات الرئيسيه المعتمده. اذا لم يتم الاحتفاظ ب# الصفحه الرئيسيه المخصصه، موقعك سيتم تفوتك خارج دواليك التحديثات و# التحسينات التي تؤدي الي Microsoft الي الصفحات الرئيسيه.

ملاحظة: إقرار إخلاء المسؤولية للترجمة الآلية: تمت ترجمة هذه المقالة بواسطة نظام كمبيوتر دون تدخل العامل البشري. توفر Microsoft هذه الترجمات الآلية لمساعدة المستخدمين الذين لا يتحدثون الإنجليزية على استخدام منتجات Microsoft، وخدماتها، وتقنياتها والاستمتاع بها. قد تحتوي هذه المقالة على أخطاء في المفردات، أو بناء الجملة، أو القواعد نظرًا لترجمتها آليًا.

مشاركة Facebook Facebook Twitter Twitter البريد الإلكتروني البريد الإلكتروني

هل كانت المعلومات مفيدة؟

رائع! هل لديك أي ملاحظات أخرى؟

كيف يمكننا تحسين ذلك؟

نشكرك على ملاحظاتك!

×