sylar-cardelement-memory

[wild viper]

Hello 👋
I'm not seeing the same behavior here
https://4242.io/test/card-element-split/

[limpid fractal]

Stripe initialization

export const getStripe = (
  options?: StripeConstructorOptions,
): Promise<Stripe | null> =>
  loadStripe(process.env.REACT_APP_STRIPE_KEY || "", options);

const stripe = getStripe();
const PageElement = () => {
...

return(
<Elements
  stripe={stripe}
  options={{
    clientSecret: setupIntentSecret,
  }}
  key={setupIntentSecret}
>

<Component />
</Elements>
);
}


const Component = () => {
  const elements = useElements();
  const stripe = useStripe();

...
return (
  <>
  <CardNumberElement props />
  <CardCvcInput props /> 
</>
);
}

Maybe I miss something with client initialization?
Can I use separately

CardNumberElement
CardExpiryElement
CardCvcElement

elements?

[wild viper]

not sure what you mean by that

[limpid fractal]

I mean that I use stylized Elements nested inside one component just like that

<div>
<CardNumberElement />
<CardExpiryElement />
<CardCvcElement />
</div>

can it cause the issue? infact I notised that only one component causes the leak and its CardNumberInput.
I dont use out of the box form, I create separate inputs

[wild viper]

yeah that shouldn't be a problem. The link I shared above uses split card element.

it must be something in your project config or render logic that is causing this

[limpid fractal]

Ok, thank u, I'll try to make a repro and if its still an issue i'll put it here

[wild viper]

Sounds good!

Good luck

[ionic lily]

sylar-card-element-mem-leak

[limpid fractal]

Im back.
Please take a look:
https://9kh5cj.csb.app/
just switch between home and form pages

[wild viper]

yeah not seeing any major usage here either

Do you have any chrome extensions on your browser or configs that might affect this?

have you tried using diff browser or system?

[limpid fractal]

approx 30 switches

[limpid fractal]

Even in incognito?

[limpid wave]

I saw mine go up similarly but it is going back down now

It also peaked around 178 MB

Oh whoops I was looking at the wrong number. Also that may have been automatic garbage collection. I'll try to reproduce and can report

[limpid wave]

What is that latest screenshot saying?

Oh are you saying that your memory usage is not going down like mine did?

[limpid fractal]

Left painting:
Memory allocation
Right:
The value stays the same

[limpid fractal]

Right

I also tested it in incognito mode Chrome browser and Opera browser

[limpid fractal]

@wicked viper Welcome )

[wicked viper]

Just catching up here - give me a few minutes

[ionic lily]

rvolf

sylar-cardelement-memory

[wicked viper]

I've got some other folks taking a look as well - sorry it's taking so long

[limpid fractal]

No problem pal, its good to know u r looking into it

[wicked viper]

We've been trying your site on our end and we're not seeing quite the same behavior - for us the value on the right panel will increase and then come back down

You were saying when you try on your end you're stays at that high value, correct?

Which version of Chrome are you using?

[limpid fractal]

Yes, its still there devours my mem.
Chrome 120.0.6099.129

[wicked viper]

and this is after not switching between tabs for a while, right?

[limpid fractal]

its been there for 40 minutes on hold

[wicked viper]

gotcha

[limpid fractal]

I can confirm the same behaviour in Chrome 120.0.6099.130 (latest)

[wicked viper]

Yes we were also testing on 120.0.6099.129 and we're not seeing the same thing

[limpid fractal]

@wicked viper Is this the way u test it?

[wicked viper]

Yup, that's the way we've been testing it

[limpid fractal]

Anyway, can we assume Im not the only one who is facing this problem?)

[wicked viper]

Yeah, there must be something specific about your confirugration that we're missing that's contributing to this

I'd recommend writing into support (https://support.stripe.com/contact) so that they can pull in some folks that work on elements to take a closer look

[limpid fractal]

Ok. anyway, thank y'all for your time!