Coffeehouse Thread

7 posts

Forum Read Only

This forum has been made read only by the site admins. No new threads or comments can be added.

MANDATORY js/ajax/async web developer interview question(s)

Back to Forum: Coffeehouse
  • User profile image
    androidi

    Q: If you were to write a paging control (like the "1 2 3 … LastPage NextPage" in many forums, or  "load more comments"), how would you do it, keeping in mind server/db performance and user experience?

    Follow-up #1: The user is light-seconds away from the server or there may be other factors which make each server&/db access slow. What, if anything, would you have to change in your implementation to ensure the user gets a lag-free and non-stale experience?

    Follow-up #2: Judging from many popular web sites, ensuring that "the user gets a lag-free and non-stale experience" is apparently non-trivial, where/who would you go to in order to improve the situation in time, knowing that this type of optimization may be best generalized into a library/toolkit due to its non-trivial nature.

    Follow-up #3: The device used to browse your site has just invented new keys/buttons to navigate pages. They are called "page up" and "page down". How does your site handle going up and down the pages? If there is an user editable control with input given to it, but not active, and the user presses "page down", while there also is a paging control on the page which could be activated if the user doesn't have edit control active, what should happen?

     

    A: I'm leaving the implementation open but lets just say I would expect paging related buttons/links to work instantly without even going to the network unless a set time had elapsed from last caching of the page links. For #3 I haven't really thought about this but it's obvious that user input/data should not get deleted from pressing next/previous page key or even ESC when such keys result in the browser staying on the same URL as seen in address bar. If there are multiple paging controls and even embedded scrolling views it's all about visual cues of where the focus is - sometimes I find that just a blinking caret doesn't always grab attention in terms of which control is in focus so it's best to ensure that if there's user data entered but not submitted, there has to be a warning before doing actions that would result in loss of that data/ previously entered input.

  • User profile image
    PaoloM

    Where is the dataset you're paging? On the client already?

  • User profile image
    cbae

    Are you able to disable the paging controls when an editing control has focus?

  • User profile image
    androidi

    The implementation details being asked deal with the client side. The data is not on the client and the interviewee is asked about how would they make it seem like if the paged data was local to the client. Ideally the only scenario where this "illusion" breaks down is if the user rapidly switches pages.

    You may have heard of web browser accelerators which pre-load content behind links in the page before user clicks them, the implementation being asked in the follow up questions is aiming for something similar but on a fine grained level of just the paging control, which these days if implemented with ajax probably doesn't get pre-loaded by browsers "pre-load technology".

    I was hoping to show a good example of this well implemented but I can't recall any web site which actually does this properly! I checked out bing/google image search and neither apply this logic in their implementation, which results in extremely poor user experiece as you have to wait for all the new images to load after each press of Page Down. However that image pre-loading can be quite wasteful and what I'm after is that paging controls which deal with text data sets like forum-threads/blog-comments, would pre-load and cache the content at the client with ajax. This should be implemented in common toolkits/libraries and the overall logic should be easy to apply to custom paging controls like "rotating wheels of images", often seen in Channel 9 demos. The demos always work nice *locally* but if your server & db is on the other side of the world and over SSL connection, will it *still* appear to work just as if the data was local? That's the problem being asked to solve here. I gave some obvious hints here (pre-load & cache) but a developer interviewee could drill in bit further on how he would go and implement this and what are potential problems.

  • User profile image
    androidi

    @cbae: Can you clarify? Suppose there's a blog with comments that are paged on a site and an "add reply" control with edit box, if you press "Page down" on your PC keyboard while the edit box is active, of course the paging control should not receive this.

    The real problem I see is that if Page down already controls scrolling of the page but you want to have a traditional paging system which simulates flipping a physical book page, you would have to ensure all the content on the web page fits on to the user window, steal the page up/down keys from the browser somehow and redirect them to the paging control - unless you make it necessary for the user first to activate the wanted paging control, which may be necessary if there are several paged data sets available on same url. Alternative approach is the one seen in Bing image search, which works quite well for that particular example except that it doesn't pre-load the images that would appear when you press any of End, page-down keys - there's a moment in which all the images are gray boxes. I have high end system and connectivity so Bing works OK but when implementing this type of paging, assume worst case latency and chatty encryption. So Bing actually fails this interview question, they didn't assume worst case conditions.

  • User profile image
    magicalclick

    Use SkyDrive photos?

    Leaving WM on 5/2018 if no apps, no dedicated billboards where I drive, no Store name.
    Last modified
  • User profile image
    magicalclick

    accident click.

    Leaving WM on 5/2018 if no apps, no dedicated billboards where I drive, no Store name.
    Last modified

Conversation locked

This conversation has been locked by the site admins. No new comments can be made.