Roopesh Vetchavetcharoopesh.hashnode.dev·Sep 24, 2024How to create infinite scrolling cards in react & next.js?Recently, at my agency UNIOdessy, we decided to add a new element to showcase our work. We tried various components, but none of them matched our aesthetic. So, we created and re-designed a scroller, a component that does the job for us. Step 1: Inst...Discussinfinite-cards
Eaysin Arafateaysin-arafat.hashnode.dev·Sep 17, 2024Optimizing Performance in a React Application: A Case StudyDuring the development of a complex React application, we faced significant performance challenges, particularly with the initial render time. In this article, I will discuss some of the issues we encountered and the strategies we implemented to addr...Discuss·81 readslazyload
Savistupidsavi.hashnode.dev·Sep 6, 2024What is Intersection Observer API?The Intersection Observer API lets you check when an element on a webpage comes into or goes out of view, based on its position relative to the viewport or a parent element. It does this asynchronously without blocking the main thread, so it’s more e...DiscussIntersectionObserver
Modefoluwa Adeniyi-Samuelmode9writes.hashnode.dev·Aug 25, 2024Implementing Infinite Scroll in a Blog with JavaScript and Intersection ObserverImplementing Infinite Scroll in a Blog with JavaScript and Intersection Observer Introduction: Alright, let's talk about one of the coolest tricks you can pull off in web development: Infinite Scroll. Imagine you’re strolling through an endless buffe...DiscussJavaScript
Tushar Khannacodertushar.hashnode.dev·Aug 22, 2024Infinite Scroll in JS & ReactIn JS:Infinite scroll is a technique used in web development to load content dynamically as the user scrolls down a webpage, creating an endless scrolling effect without requiring the user to navigate to a new page. Below is a basic example of how to...DiscussReact
Nani Samireddynanisamireddy.hashnode.dev·Jul 26, 2024Understanding the Intersection Observer APIThe Intersection Observer API is a modern web API designed to observe changes in the intersection of a target element with an ancestor element or the viewport. It provides a way to asynchronously observe changes in the intersection of an element with...DiscussJavaScript
Nadim Anwarblog.nadim.in·Jul 15, 2024Improve Content Loading: The Benefits of Infinite ScrollingIntroduction In today's fast-paced digital world, users expect seamless and uninterrupted browsing experiences. Infinite scrolling is a web design technique that meets this expectation by continuously loading content as users scroll down a page. This...DiscussReact#unsplash-api
Jayesh Adwanijayeshadwani.hashnode.dev·Jul 14, 20242 ways to implement infinite scroll in javascriptFetching a list from database is always a requirement in almost every app. To cater this, the concept of pagination was introduced. Which helps to fetch data in small chunks to load into UI. P.S: Fetch data in chunks (via pagenumber) To achieve this ...Discussinfinite scrolling
Sazzadur Rahmansazzadur.hashnode.dev·Jun 17, 2024Building an Infinite Scroll FlatList Component in ReactJS: A Comprehensive GuideIntroduction A FlatList is a performant interface for rendering large lists of data. Commonly used in mobile applications, especially in React Native, Flatlist components help in managing complex lists efficiently. This article will guide you through...Discuss·2 likes·32 readsWeb Development
Ammar Mirzaammarmirza.hashnode.dev·Jun 14, 2024How to Create an Infinite List with Tanstack (React Query & Virtual)What's up, Techies? As you are already familiar with the title, today we are going to discuss creating an infinite list with the help of Tanstack Query and Tanstack Virtual. We will be using a virtualized list approach to render a huge list of items ...Shad Mirza and 1 other are discussing this2 people are discussing thisDiscuss·58 likes·620 readsinfinite scrolling