Problem is solved. Turns out i was pulling all the images for lookup.
allImages = await ctx.Images.AsNoTracking().ToListAsync(token);
allImages = await ctx.Images
.AsNoTracking()
.Select(img => new Fatalix_Project_Image
{
Id = img.Id,
OriginalFileName = img.OriginalFileName
})
.ToListAsync(token);
This was more than enough. It was loading more than 20 mbs of image data everytime i swap to a project display page. The imagedata should never be loaded.
In this sense i was hoping cancellation token would save me the trouble but turns out it does not.
Currently blazor page is functioning perfectly, as each image is loaded through a controller instead of a linq query.
[HttpGet("{id}")]
public async Task<IActionResult> GetImage(int id)
{
var image = await _context.Images.FindAsync(id);
if (image == null || image.ImageData == null)
return NotFound();
var contentType = "image/jpeg";
if (image.OriginalFileName.EndsWith(".png")) contentType = "image/png";
else if (image.OriginalFileName.EndsWith(".gif")) contentType = "image/gif";
return File(image.ImageData, contentType);
}
A rookie mistake, but still took me 14 days to find the source of the problem. Thanks.