Comments (5)
Hello @bonesoul sorry for being late. Did you solve it?
If you want, you can create a PR fixing that would be awesome and so helpful to me.
Other Way if you can't, just tell me and I'll work on it to solve it.
from use-next-blurhash.
I`m having the same issue. The cause of the problem seems to be the mismatch in image data url created on server and on client.
from use-next-blurhash.
Hi @krstivojevicv! I couldn't understand, could you give me an example?
And why do you create the dataUrl on the server?
But I'm not sure if I understood why the bug happens.
from use-next-blurhash.
Hello @ivansevillaa
Thx for the lib by the way :)
Its easy to reproduce, just run the NextJS app in SSR mode. Im not creating dataUrl on the server, nextjs is. It prerenders the html page on server and then hydrates it on client (https://reactjs.org/docs/react-dom.html#hydrate). My guess is that issue is a result of image generated on server side (by canvas lib - https://www.npmjs.com/package/canvas) differs from image generated on client side during hydration.
I might be wrong, but this is the only explanation I could come up with
from use-next-blurhash.
Fixed on #6.
If the error is still reproducing, reopen the issue please
from use-next-blurhash.
Related Issues (12)
- SSR? HOT 2
- suggestion: don't use canvas anymore HOT 3
- Installable package broken due to questionable code change in build HOT 1
- hook returns gray image HOT 10
- Not working on latest version of nextjs HOT 1
- How to not block rendering? HOT 1
- [Solved] Vercel Deployment Error (version `ZLIB_1.2.9' not found) HOT 17
- Why a hook? HOT 2
- Error: Cannot find module '../build/Release/canvas.node' HOT 3
- xxx has "placeholder='blur'" property but is missing the "blurDataURL" property. HOT 11
- Install Error npm HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from use-next-blurhash.