Delay by the first touch on IPad

8 posts, 0 answers
  1. Vyacheslav
    Vyacheslav avatar
    4 posts
    Member since:
    Mar 2016

    Posted 02 Jun 2017 Link to this post

    I use the Kendo with AngularJS. I define the datasource for my drop-down-list during initialization of the page, together with other options and define it via k-options.
    In other places it works fast, on the desktop, android devices and so on.  But when I touch on the drop-down-list on my IPad first time, the delay occurs around 2-3 seconds. Then of course it works fast.

     

    How can I reduce a delay by the first touch? 

  2. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 06 Jun 2017 Link to this post

    Hello Vyacheslav,

    Have you tested to confirm if the issue comes from slower data retrieval on the iPad? You can try replacing the DropDownList DataSource with a local array of data and see if this works faster. If the problem is with binding, you can consider calling read() for the DataSource in advance, so it and the DropDownList are aleady populated when the user clicks the dropdown.
    If the issue is not related to binding, could you share the code related to this issue or a link to the page that you are opening, so we can test this on our side?

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Vyacheslav
    Vyacheslav avatar
    4 posts
    Member since:
    Mar 2016

    Posted 09 Jun 2017 in reply to Tsvetina Link to this post

    Hello, 
    Thank you for response. :-)
    I tried to call read(), but it didn't get any positive results. I tried to define like this:

     <select kendo-drop-down-list k-options="typeListOptions" k-ng-model="selectedType">
                                <option disabled>Choose a character</option>
                                <option value="Cheburashka">Cheburashka</option>
                                <option selected value="Crocodile Gena">Crocodile Gena</option>
                                <option value="Shapoklyak">Shapoklyak</option>

    </select>

    and of course kendo-options don't contain datasource, but still I'm getting a delay before first opening.

    So , it's interesting that our tester told me that it occured when we increased version of Kendo to 2017.1.223.

  4. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 13 Jun 2017 Link to this post

    Hi Vyacheslav,

    I tried to reproduce this in a Dojo, running it in fullscreen mode on an iPhone, but the DropDownList opened without such a delay. You can see the Dojo here and the fullscreen version here. Can you test it on your iPad to confirm if you are able to see the delay? If this sample does not reproduce it, can you tell what needs to be changed in it to be able to see the delay?

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Vyacheslav
    Vyacheslav avatar
    4 posts
    Member since:
    Mar 2016

    Posted 13 Jun 2017 in reply to Tsvetina Link to this post

    Hello,

    Thank you for your reply. 

    I've found the conditions for reproducing this problem, this occurs when the select (kendo-drop-down-list) element is located inside <iframe> . I tried to open the page directly , and the delay disappeared, but when I tried again open the page via <iframe>, the delay appeared. 

     

    BR, Vyacheslav

     

  6. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 15 Jun 2017 Link to this post

    Hi Vyacheslav,

    I am able to observe a small delay in the DropDownList opening when I load it from an iframe. It looks the following has some effect on the problem, but I cannot tell for sure, as the delay is not that long on my side.
    • Give fixed size to the iframe, preferably bigger than the size of the dropdown, so the iframe does not have to be resized to view the DropDownList content.
    • Add the following to the page containing the DropDownList:
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    Additionally, I would recommend against using iframes on iOS, as they are known to cause other problems as well, e.g. unscrollability.

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Vyacheslav
    Vyacheslav avatar
    4 posts
    Member since:
    Mar 2016

    Posted 15 Jun 2017 in reply to Tsvetina Link to this post

    Hello,

    Unfortunately, I'm still getting such delay. But anyway, thank you for for your response. 

     

    BR, Vyacheslav

  8. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 19 Jun 2017 Link to this post

    Hello Vyacheslav,

    In such a case, I could only suggest giving up the iframe, for the iOS case at least. You could detect if you are running on an iOS device using the kendo.support.mobileOS property. In such case, if the page is part of a hybrid app, you could use the InAppBrowser to open it. If it is browsed as a web site, consider opening the content of the iframe in a new View or ModalView.

    Regards,
    Tsvetina
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top