README

This web application, written in Rails, completes the following task

Tech Stack

  • Will Paginate => Paginate records.
  • Bootstrap SASS => Import Bootstrap stylesheets.
  • Bootstrap Will Paginate => Import bootstrap classes to style pagination URLs.
  • The above open source gems(library equivalent of Ruby) have been used to complete the task.

Introduction

  • This web application implements lazy loading for posts and images.
  • Lazy loading for posts has been implemented by pagination at the backend and AJAX requests to the controller action, on a scroll event.
  • Lazy loading for images has been done using two methods - 1) Unveil JS 2) Custom JS

Web Application

Testing

  • Once you have followed the instructions for installations, the PUMA server would be up and running.
  • Open a browser and navigate to localhost:<port>/posts, for lazy loading in posts, according to user's consent(on scroll event). Lazy loading in posts is throttled using Loadash
  • Navigate to localhost:<port>/posts/load_more_button, for lazy loading in posts, according to user's consent(on clicking a button) to retrieve more information from backend.
  • Navigate to localhost:<port>/posts/lazy_load_unveil_images, for lazy loading in images, implemented using Unveil JS
  • Navigate to localhost:<port>/posts/lazy_load_images, for lazy loading in images, using a custom JS.

Resources