« first day (4374 days earlier)      last day (567 days later) » 

6:37 AM
Hello everyone
 
@colan Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
 
6:53 AM
Hello, I have a audio tag which I load() on pause event so that the browser doesn't keep downloading. But with this, now when the use drags the progress bar to go backwards, the user agent triggers pause, which in turn reloads the song.
 
 
2 hours later…
9:03 AM
Anyone who have experience with debounce resize ?
and re rendering components in React
I have strange behavior where div triggered in ` const [width] = useWindowSize()
` disappearing
useWindowSize is debounce resize
when I remove width condition, works ok
 
9:29 AM
@KevinB ??
 
Anoyone of you having problems when tracing code in chrome that mouseover to show variable value doesn't seem to work?
 
10:24 AM
hwat
 
For example when I set a breakpoint in chrome and look at the code, usually I could mouseover a variable to see it's value.
Now I have to look in the scope panel
 
Works for me
 
hmm. do you run windows?
 
 
1 hour later…
12:02 PM
 
 
3 hours later…
2:54 PM
Anyone familiar with GraphQL and MongoDB able to take a look at this and point me in the right direction?
https://stackoverflow.com/questions/73986923/graphql-typedef-resolver-for-array-of-objectids-mongodb
 
 
4 hours later…
7:17 PM
How useEffect hook actually works
It's very confusing if we have 5 useEffect hooks
but in two or three , the same dependencies
What's the order of execution ?
 
sounds like a poor design
the order of execution shouldn't matter, if designed properly
(presumabily they'll run in the order they are defined)
 
If one useEffect depends of another
 
one shouldn't depend on the other
An overdependence on useeffects to perform, for example, asynchronous actions is evidence that some higher tier of abstraction is needed
 
  useEffect(() => {
    setShouldUpdateMetadata(true)
  }, [setShouldUpdateMetadata])

  useEffect(() => {
    if (shouldUpdateMetadata) {
      loadPortfolioMetadata()
      setShouldUpdateMetadata(false)
    }
  }, [
    getSettings,
    loadPortfolioMetadata,
    selectedPortfolioId,
    shouldUpdateMetadata,
    setShouldUpdateMetadata,
  ])

  useEffect(() => {
    if (
      !!selectedPortfolioId &&
      selectedPortfolioId !== -1 &&
      mounted.current
    ) {
      loadPortfolioReports({ portfolioId: selectedPortfolioId })
and more
What's the order in this case ?
 
¯\_(ツ)_/¯
don't care to dig through it
 
7:22 PM
let's see simple example
if we have five useEffects
and the same dependencies in the 3
What will be order of execution ?
 
i would assume, they will run in order
 
Synchronously ?
 
nothing in javascript happen simultaneously
 
Then it's not in order
 
so yes, they'll run one after the other, in the order you defined them in.
 
7:24 PM
1, 2, 3 and not 1, 3, 2
? ?
 
That would be my assumption
however i have not combed through react's source
it's far more productive in these cases to just execute the code
What other order would you expect it to be in?
 
I am not sure
If I have the same deps defined twice
 
"random" order doesn't exist, 1,3,2 only happens when something causes 2's addition to the stack to be more delayed than 3.
my typing is shit today
 
7:41 PM
  const number1 = 1;
  const number2 = 2;

  React.useEffect(() => {
    console.log('on load')
  }, [])

  React.useEffect(() => {
    console.log('number 1 has changed')
  }, [number1])

  React.useEffect(() => {
    console.log('number 2 has changed')
  }, [number2])
why number 1 has changed when I change number2
If I change number2 value manually, I am expecting just on load and number 2 has changed logs
 
8:01 PM
import React from 'react';

export default function App() {
  const [num1, setNum1] = React.useState(1);
  const [num2, setNum2] = React.useState(2);

  React.useEffect(() => {
    console.log('on load');
  }, []);

  React.useEffect(() => {
    console.log('number 1 has changed');
  }, [num1]);

  React.useEffect(() => {
    console.log('number 2 has changed');
  }, [num2, num1]);

  return (
    <div className="App">
      <button onClick={() => setNum1(11)}>Change number 1</button>
      <button onClick={() => setNum2(22)}>Change number 2</button>
This works as expected
 
8:44 PM
!!mdn useEffect
 
wat
 
9:05 PM
haha wat :D
your 'child' jokes with you
 

« first day (4374 days earlier)      last day (567 days later) »