Everything *[NYC] 2026: see what we announced. →

Skip to content

Content operations
Studio
Content Agent
App SDK
Media Library
Content Releases
Agent API
Content backend
Content Lake
Sanity Context
MCP Server
Functions
Live CDN
The only platform powering content operations
Start building for free
Start building for free
By Industry
E-commerce & Retail
Media & Publishing
SaaS
By Team
Developers
Content Editors
Product Owners
Business Leaders
Tecovas strengthens their customer connections
Read the story
Read the story
Build and Share
Sanity 101
Sanity Learn
Pioneers
Frameworks
Templates
Tools and plugins
Schemas and snippets
Join our community
Insight
Company blog
Engineering
Events & Webinars
Customer stories
Guides
Use Cases
Grab your gear: The official Sanity swag store
Read Grab your gear: The official Sanity swag store
Docs
Enterprise
Pricing

Log in Contact Sales Get started

Content operations
Content backend
By Industry
By Team
Build and Share
Insight
Docs
Enterprise
Pricing
Login

Exchange
Projects

Tedspace

Portfolio site

By Ted Littledale

View project live

Get started for free Explore the demo

About the project

Portfolio built using Next.js and hosted on Netlify.

As I didn't want to use Vercel to host I had to implement my own lazy loading image component. This was fairly easy to implement and gave me complete control over when the images loaded. Using the Next image component images would only load once in the viewport which often resulted in seeing the image load briefly. I was able to implement a version which loads the images of the next section once the previous section is in view so images are always loaded before they are in the viewport.

Contributor

Ted Littledale

Creative Technologist, Front End developer, Data Visualisation tinkerer, and a successful startup founder

Visit Ted Littledale's profile

Tell us what you think

Join our community on Discord

Subscribe to our newsletter

Products

Sanity Studio
Media Library
Sanity Context
Canvas
Content Agent
MCP Server
Content Releases
Insights
App SDK
Content Lake
Live CDN
Functions
Agent Actions
AI Assist
Use cases

Resources

Docs
Sanity 101
Sanity Learn
Tools and plugins
Pioneers
Frameworks
Templates
Schemas and snippets
Guides
Headless CMS explained
Resource library
Explainers
Enterprise CMS guides
Headless CMS Guides
Enhancing your CMS with AI
Agent context guides
Compare Sanity
Glossary
Pricing
For agents

Company

Contact
Blog
Engineering
Shop
Webinars & Events
Careers
Changelog
Customer Stories
Agency Partners
Technology Partners

Trust and compliance

Privacy policy
Terms of service
Data Processing Addendum
Accessibility statement
Transparency statement
Security and compliance
Responsible disclosure
Open Source Pledge

Keep in touch

© SANITY

OSL, NOR (CET)

SFO, USA (PST)

Loading system status...

Change Site Theme

All Contributions Official (110)Community (1474)Answers

Application

Marketing site (353)
Product & Service (156)
E-commerce Resources (136)
Mobile App Resources (12)

Workflow

Collaborative Editing (203)
Optimization (157)
Localization Resources (64)
Artificial Intelligence (AI) (61)
Multichannel (40)

Integration

Content Enrichment (341)
Publishing (303)
APIs (176)
Distribution (91)

Frameworks

Next (450)
React (344)
Tailwind CSS (212)
Gatsby (96)
Astro (82)
Svelte (46)
Nuxt (42)
Vue (38)
Remix (32)
Hydrogen (19)
Eleventy (16)
Angular (14)
React Native (11)
React Email (7)
Gridsome (5)
.NET (5)
Refine (2)
Jungle.JS (2)
Metalsmith (1)
Jovo (1)

All Guides (347)Official (39)Community (308)

Application

Marketing site (51)
Product & Service (23)
E-commerce Resources (13)
Mobile App Resources (2)

Workflow

Collaborative Editing (43)
Optimization (39)
Artificial Intelligence (AI) (14)
Multichannel (13)
Localization Resources (8)

Integration

Publishing (86)
Content Enrichment (61)
APIs (37)
Distribution (24)

Frameworks

Next (76)
React (53)
Tailwind CSS (21)
Gatsby (12)
Remix (10)
Svelte (8)
Eleventy (7)
Nuxt (5)
Vue (5)
Astro (5)
Angular (4)
Hydrogen (2)
Jungle.JS (2)
.NET (2)
Gridsome (1)

All Tools & Plugins (321)Official (43)Community (278)

Application

Marketing site (27)
E-commerce Resources (22)
Product & Service (10)
Mobile App Resources (5)

Workflow

Collaborative Editing (51)
Optimization (51)
Localization Resources (16)
Artificial Intelligence (AI) (9)
Multichannel (8)

Integration

Content Enrichment (94)
Publishing (70)
APIs (50)
Distribution (35)

Frameworks

React (73)
Next (26)
Gatsby (6)
Vue (5)
Tailwind CSS (4)
Astro (4)
Remix (3)
Svelte (3)
Hydrogen (2)
Angular (2)
Refine (2)
Nuxt (2)
Gridsome (2)
React Native (1)
Eleventy (1)
.NET (1)

All Templates (111)Official (10)Community (101)

Application

Marketing site (1)

Frameworks

Astro (53)
Next (52)
React (26)
Tailwind CSS (13)
Remix (5)
Angular (5)
Svelte (4)
Hydrogen (3)
Nuxt (3)
Vue (2)
React Native (1)
React Email (1)

All Showcase projects (622)Official (1)Community (621)

Application

Marketing site (259)
Product & Service (118)
E-commerce Resources (91)
Mobile App Resources (4)

Workflow

Collaborative Editing (91)
Optimization (44)
Localization Resources (37)
Artificial Intelligence (AI) (32)
Multichannel (16)

Integration

Content Enrichment (122)
Publishing (110)
APIs (67)
Distribution (23)

Frameworks

Next (296)
React (192)
Tailwind CSS (174)
Gatsby (78)
Nuxt (32)
Svelte (31)
Vue (26)
Astro (20)
Remix (14)
Hydrogen (12)
React Native (9)
Eleventy (8)
React Email (6)
Angular (3)
Gridsome (2)
.NET (2)
Metalsmith (1)
Jovo (1)

All Recipes (183)Official (17)Community (166)

Application

Marketing site (15)
E-commerce Resources (10)
Product & Service (5)
Mobile App Resources (1)

Workflow

Optimization (23)
Collaborative Editing (18)
Artificial Intelligence (AI) (6)
Localization Resources (3)
Multichannel (3)

Integration

Content Enrichment (64)
Publishing (37)
APIs (22)
Distribution (9)

I agree to receive email communications from Sanity. I can unsubscribe at any time.

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.