Open iongion opened 4 years ago
Love this project, you can try to make it cover / exemplify a real world case.
A fictive security camera system where you are "Fetching multiple images from N cameras at T-interval".
A sample:
const jitterTime = require('jitter-time'); const images = ['1.jpeg', '2.jpeg', '3.jpeg']; const imageElements = images.map((url) => { const image = document.createElement('img'); image.setAttribute('src', url); return image; }); function syncDataWithServer() { const { url, index } = this; const noCacheKey = encodeURIComponent(Math.random()); const freshUrl = `${url}?v=${noCacheKey}`; imageElements[index].setAttribute('src', freshUrl); }; const queries = images.map((url, index) => { const POLL_INTERVAL = jitterTime(5, 0.2); return setInterval(syncDataWithServer.bind({ url, index }), POLL_INTERVAL); }); // Cleanup // queries.forEach((id) => clearInterval(id));
Here a cute sandbox ideea
https://codesandbox.io/embed/pedantic-surf-zp971?autoresize=1&expanddevtools=1&fontsize=14&hidenavigation=1&theme=dark
Love this project, you can try to make it cover / exemplify a real world case.
A fictive security camera system where you are "Fetching multiple images from N cameras at T-interval".
A sample: