Drawing points with different size with shaders

Questions
1

Hi guys, I am trying to achieve something similar to this but without animation and I want to be able to pass points locations from react size, if it is super heavy to use array with points, then maybe is possible to just modify the fragment shader code whenever I need to draw another point?
for example

from react side:
i have 1 point (40,50) with size 5

shader:
“draw point at (40,50) of size 5” code here

so then update with another point from react side:
[(40,50) with size 5,
(50,100) with size 1)]

shader:
“draw point at (40,50) of size 5” code here
“draw point at (50,100) of size 1” code here

2

im not sure i understand but according to that link you want to sample distribute points across a surface with varying sizes? in react.

then probably this (the frosting, sprinkles and sugar pearls are sampled)

ps i believe you can use drei/samples with points all the same, instead of an instancedmesh