The goal of this assignment is to develop a responsive web application with various features to enhance user experience and performance. The application will include features such as infinite scrolling using Intersection Observer, caching static assets and API responses, retaining scroll position on refresh, navigation with React Router, state management with Redux/Toolkit, post search functionality, lazy loading of images, and support for dark/light themes.
- The application should be responsive and work seamlessly across different devices and screen sizes.
- Implement infinite scrolling using Intersection Observer to load more content as the user scrolls down the page.
- Utilize Cache API to cache static assets for improved performance.
- Implement IndexedDB for caching API responses, using a network-first cache strategy to ensure offline availability and faster loading times.
- Implement functionality to retain the scroll position when the page is refreshed to enhance user experience.
- Use React Router for navigation between different pages of the application.
- Implement state management using Redux/Toolkit to manage application state efficiently.
- Allow users to search for posts within the application.
- Implement lazy loading of images to improve page loading performance and reduce initial page load time.
- Provide support for both dark and light themes to accommodate user preferences.
- React.js for building the user interface.
- React Router for handling navigation within the application.
- Redux/Toolkit for state management.
- Intersection Observer API for infinite scrolling.
- Cache API for caching static assets.
- IndexedDB for caching API responses.
- CSS for styling and theming (Dark and Light).