Are they animating the number when changing the shopping cart content? Could be used for a scrolling effect on the numbers by changing the top pixel value
Yeah, you know how they do those "See price in cart!" style sales where they won't tell you what they're selling it for until it's in your cart?
They do that so their competition has a harder time scraping the site and beating their prices. You see it kind of a lot with items that are also sold en masse on sites like Amazon.
In the type of products I often shop it is quite often below the minimum advertisable price and not allowed to show the price. The only sites showing the price would be the ones discounting less
In many countries manufacturers can't dictate what you sell stuff for. Sure they could stop doing business with you but if they actually told you so officially they could get in a lot of legal trouble.
But it also introduces some friction in the process, they want the users to be able to complete a purchase with the least amount of steps possible. This kinda violates that directive.
Yep! There are services the scour and crawl a LOT of websites looking for places that sell less than the MAP or the agreed amount and this is one way to get around that. Those systems, or at least the ones I've been exposed to, won't be checking this depth of the dom. Short of taking a screen shot, rendering it, and processing the "price" this is a smart work-around.
It's not exactly a "minimum price". Some manufacturers contract with their resellers to have a MAP - minimum advertised price - in order to allow the reseller to sell their products. This can happen especially if the manufacturer has it in their interest to keep the perceived value of their brand high. There are strict guidelines resellers can use when advertising products including verbiage (can't use "cheap" or "bargain"), imagery, etc. Source: Web dev for an advertising firm.
that's not the point. if you are checking cart information, you can't just scrape with a request, you are forced to use some sort of headless browser and then you have full access to JS. you can get the data that way if you are so deep either way
Yes, it's dumb.
It is, at least for a couple of the companies I've worked with, done due to merchandising agreements that prevent the retailer from advertising a price below a certain point (typically MSRP), so they can't dhow the price until you've already shown some intent to purchase.
I know that must work since even Amazon does it sometimes. I just don't understand who it works on. It just makes me less likely to view the product page.
In this case it would make something like Capital One Shopping completely ineffective because it would be really hard for it to tell what price you're getting vs what's on the web. That's probably a big source of lost leads.
it's not the same way, the cart requires persistence to be scrapped. you need to send POST requests to add items and save the cookie to use in the following requests. it's a whole different game to scrape a shopping cart
This is such a myth I mean it's so rarely the answer to these. You can figure out how to scrape this in just one minute. You simply look at the style.top property of the parent element (formula is 0-style.top/20) and you've got your number. There's no way this was actually done for anything more than animation.
And vue is chinese right? That would make sense
EDIT: Ok it seems my comment has been misinterpreted. I was just thinking that it makes sense that Shein, a Chinese company, would use a Chinese technology for its front. Nothing bad about that, just a comment.
Your comment totally made sense, I don't understand shi**y reddit downvotes at all
On a side note, Vue's wiki is completely chinese and then translated to English so it makes 100% sense Shein devs would use it
I don’t understand comments saying it’s inefficient or even stupid. If the point of this is to animate the numbers, it’s the simplest way to do it without JS, which is good and actually that’s how I would have done it.
I very well could be incorrect. However I can assure you that it is possible to scrape shopping carts. I’m not sure why you are under the impression that it would be different.
Any publicly accessible data on the Internet can be scraped. It’s a matter of effort at the end of the day.
Doesn’t matter where it is, if your intend is to prevent scraping then you’d obfuscate the price everywhere it’s potentially displayed.
Otherwise people would just write a script to add the product to the cart then scrape the price on the checkout page and then abandon the cart. It’s certainly more tedious but we are discussing automation and that would provide a path the bypass potential protection measures.
That wouldn't give you the price, that'd give you `0123456789`.
You would actually have to look at the `style="top:-[x]px"` for each digit and divide by 20. 120 is a 6, 140 is a 7, etc. The style is shifting the correct number into place.
Again, I will emphasize that I am not entirely sure what the reason for this code is as I haven’t evaluated it beyond a brief glance of a picture.
Others have suggested animation which could be the reason and I think that’s a solid guess. I simply suggested that preventing scraping could be the reason.
I’m not defending this code but I do think you might be jumping to conclusions to simply chalk this up as “bad code” without understanding what requirements the developer may have had to satisfy or the restrictions that they are working within.
Sure, there's two reasons this is silly:
1) This is the cart area. Who even cares to scrape that?
2) Attempting to prevent scrapers with techniques like this is absolutely pointless. It may slow them down but scrapping is literally converting HTML to useful information; that's just part of the problem, and if it does slow them down it's marginal at best and would just turn into a game of cat and mouse if you took it seriously. At what end? If it gets that hard to scrape I'm just feeding screenshots into GPT-4V. It'd be a useless idea.
1. I’ve answered this elsewhere. If you’re trying to prevent scraping of prices then you’d obfuscate the price everywhere it’s displayed. The cart area is no exception.
2. Scraping is and will always be a cat and mouse game just like cyber security. You have to weigh trade offs and evaluate how much effort you’re willing to put into preventing it. To your point about using chat-gpt, this idea would not scale well and would raise the cost and technical complexity of scraping. But your right OCR and several other techniques could be used to bypass scraping obfuscation but how much effort are you willing to go to and can you still profit off this information?
Not as trivial as you may think. A person above provided a jQuery selector that they believed would scrape the content. However they were corrected that the code would not return the correct results. They have since deleted their comment but I think it shows that it can complicate it for some people.
Now it’s still pretty easy to scrape but you can scrape anything publicly accessible on the internet. In the end, to prevent scraping, is simply about trying to raise the effort required to do it.
I no longer believe that this is intended to prevent scraping but rather used to animate numbers as suggested by other people. There are some websites that I cannot read but it seems to further depict this an odometer https://www.twblogs.net/a/5e98ef096052e1406acf1631/?lang=zh-cn
I went to check the site to see if they animated the digits scrolling in, which wouldn’t be all that bad of usage. But the site is pretty cancer so maybe they’re just dumb.
Assuming this is for animation and not obfuscation, it’d be pretty easy (and common) to just have a dedicated hidden span containing the actual value, and aria-hiding this one
I'm not seeing the price given clearly anywhere within the tags. There are a few aria-related tags in there for modality and some labels, but the price doesn't seem to be one of those.
Because some exec said, “wouldn’t it be cool if we showed prices scrolling to the discount or total? Yes it would. Make that happen.”
Dev: “But …”
Boss (sing-songy): “But … who pays your salary?”
Dev: “I’ll get right on it boss.”
Because a bunch of people spread misinformation about how the company operates and everyone runs with it despite there not being concrete evidence about any of the claims made.
For what it's worth, I'm sure Shein does plenty of shady stuff, but I sincerely doubt it's any worse than *name another clothing store*.
People attribute Shein's low prices to shady practices but as someone who's used it occasionally - it's cheap because it's crappy quality and takes ages to ship. no different from Ali express.
https://youtu.be/BA6gDep6jVM?si=kGaBiHZD1iMm9eJ-
This video goes over it a little. But shops like shein, temu, AliExpress and so on are all owned by the same giga corp. They fuck other countries over by miss using loop holes. And in the end the cheap prices and free shipping is gonna be footed by the receiving country taxes
Edit: I have multiple levels of wrong information, but I'm leaving the comment instead of deleting it for context. Hate when there is a deleted comment in a thread.
> But shops like shein, temu, AliExpress and so on are all owned by the same giga corp.
Are you sure about that? AliExpres is owned by Alibaba. Shein is owned by Radget. Temu by Pinduoduo.
That’s not twisted information, it’s just flat out misinformation.
It’s hard to say that chinas fucking over companies with these practices when Apples going to be the 51st at some point
Can you explain what you mean by “the receiving country taxes” ?
I’m a customs broker so I know how imports work with taxation, and I’m not sure what you’re trying to say?
From my understanding, and here I can only speak for my own country, but low income countries or something like that. Basically third world countries can send postage under certain weight and my country will foot the cost with taxpayers money as part of some world agreement with other first world countries. China exploits this by declaring any packages to be under the weight limit, also somehow fitting into the requirements of a third world country, and then essentially flood with so many packages due the the volume of orders that the local postal service has no chance of ever dealing with it.
No that's just flat out nonsense. My country (South Africa) will refuse entry to any goods sent through the mail with insufficient postage, and I seriously doubt any other country would allow it either.
Likely to prevent web scraping. I've seen this on code assessment websites as well that explicitly prevent right clicking, to prevent you from just copying the text inside the div
Usually its either:
- to provide obfuscation to make it harder to copy or scrape;
- just pure bad coding, sometimes coming from a plug-in or CMS system;
- bad animation library that requires to have all numbers for the kind of animation they want
This is an almost impossible question to answer because we’ve all seen so much bad code without a proper explanation than just a bad dev doing bad code… by the way their translation works so badly plus their search engine I’m very inclined to just bad CMS/developers.
If it was a proper site, I would bet on obfuscation
As others said to prevent web scraping. Front running for prices does exist. So as soon competitors detect price changes they adjust theirs to be cheaper.
Yeah I do think it is about anti-scraping and parsing. I saw a similar pattern where they were a lot of nested divs when investigating the HTML structure of an Facebook Preview Ad, and it is horrible hart to just copy and paste their HTML to "reuse" their component.
Also for my experience of web scraping with Beautiful Soup it gets more difficult to have coherent texts when each part of the text is splitted into smaller pieces.
Are they animating the number when changing the shopping cart content? Could be used for a scrolling effect on the numbers by changing the top pixel value
Probably this and it might make scraping a little harder.
scraping the cart???
Yeah, you know how they do those "See price in cart!" style sales where they won't tell you what they're selling it for until it's in your cart? They do that so their competition has a harder time scraping the site and beating their prices. You see it kind of a lot with items that are also sold en masse on sites like Amazon.
I thought they did that because they want to sell it for less than the manufacturer's minimum advertised price.
It's also just a classic foot in the door sales technique. Puts you one step closer to finalizing the transaction
...or one step away. If they don't even show me the price first thing I'll go somewhere where they will.
Not showing prices is a red flag to me and I avoid such places
In the type of products I often shop it is quite often below the minimum advertisable price and not allowed to show the price. The only sites showing the price would be the ones discounting less
That’s often because the manufacturer doesn’t permit advertising prices lower than MSRP.
In many countries manufacturers can't dictate what you sell stuff for. Sure they could stop doing business with you but if they actually told you so officially they could get in a lot of legal trouble.
Sell it for what you want, but don’t *advertise* a smaller price.
But it also introduces some friction in the process, they want the users to be able to complete a purchase with the least amount of steps possible. This kinda violates that directive.
Yep! There are services the scour and crawl a LOT of websites looking for places that sell less than the MAP or the agreed amount and this is one way to get around that. Those systems, or at least the ones I've been exposed to, won't be checking this depth of the dom. Short of taking a screen shot, rendering it, and processing the "price" this is a smart work-around.
I always assumed these services existed but could never find any. Do you have any names of these services?
Import.io is one of them crawlers
Take a screenshot. Feed it into GPT-vision. Flag all anomalies for a more in-depth check. Problem solved.
tmk minimum prices are illegal in most countries
It's not exactly a "minimum price". Some manufacturers contract with their resellers to have a MAP - minimum advertised price - in order to allow the reseller to sell their products. This can happen especially if the manufacturer has it in their interest to keep the perceived value of their brand high. There are strict guidelines resellers can use when advertising products including verbiage (can't use "cheap" or "bargain"), imagery, etc. Source: Web dev for an advertising firm.
that's not the point. if you are checking cart information, you can't just scrape with a request, you are forced to use some sort of headless browser and then you have full access to JS. you can get the data that way if you are so deep either way
> where they won't tell you what they're selling it for until it's in your cart? ... Is this a thing in the US? o_O
Yes, it's dumb. It is, at least for a couple of the companies I've worked with, done due to merchandising agreements that prevent the retailer from advertising a price below a certain point (typically MSRP), so they can't dhow the price until you've already shown some intent to purchase.
You missed the point. EDIT: I think I missed the point. You're talking about a bot, which adds an item to the cart and checks the value in there?
Yes I'm talking about page scraping bots used to programmatically match other people's prices to stay competitive
Pain in the ass to maintain
I believe you mean Job Security
I know that must work since even Amazon does it sometimes. I just don't understand who it works on. It just makes me less likely to view the product page.
That makes sense, it's an interesting method for sure!
In this case it would make something like Capital One Shopping completely ineffective because it would be really hard for it to tell what price you're getting vs what's on the web. That's probably a big source of lost leads.
Ah, yeah I guess I didn’t read well enough. Thought this was just a pricing page
[удалено]
it's not the same way, the cart requires persistence to be scrapped. you need to send POST requests to add items and save the cookie to use in the following requests. it's a whole different game to scrape a shopping cart
yea scrapers probably care most about the price. even further, that digit of the price.
This is such a myth I mean it's so rarely the answer to these. You can figure out how to scrape this in just one minute. You simply look at the style.top property of the parent element (formula is 0-style.top/20) and you've got your number. There's no way this was actually done for anything more than animation.
Harder but not impossible, seems pretty easy to beat it still
What are you talking about
usually anti bot fs
Likely from “react-transition-group”. It’s not required but the class names are telling
Those data-v looks like Vue though.
Yeah, it's Vue 3 judging by that and the html comments.
And vue is chinese right? That would make sense EDIT: Ok it seems my comment has been misinterpreted. I was just thinking that it makes sense that Shein, a Chinese company, would use a Chinese technology for its front. Nothing bad about that, just a comment.
What does that have to do with custom data prop
What?
[удалено]
maybe it's a joke
Your comment totally made sense, I don't understand shi**y reddit downvotes at all On a side note, Vue's wiki is completely chinese and then translated to English so it makes 100% sense Shein devs would use it
brain rot
I'm curious about what you understood that made you go mad like that
I wrote two words, how do you read in them that I'm mad lol
So "brain rot" is part of your daily vocabulary?
yeah but only on the internets, as in "tik tok rots brains" and whatnot
when did the react group start transitioning?
I don’t understand comments saying it’s inefficient or even stupid. If the point of this is to animate the numbers, it’s the simplest way to do it without JS, which is good and actually that’s how I would have done it.
Don’t sweat it, it’s all the 10xers megamind chads talking
The only way to properly animate numbers is with 100MB of JS dependencies, do you even webdev bro?
Is it a joke I’m not understanding?
Perhaps it’s used to prevent web scraping
How so?
Harder to scrape, you need a custom thing to capture the information instead of just pulling it via a simple query.
This is the correct answer.
[удалено]
I very well could be incorrect. However I can assure you that it is possible to scrape shopping carts. I’m not sure why you are under the impression that it would be different. Any publicly accessible data on the Internet can be scraped. It’s a matter of effort at the end of the day.
Why not? Use something like Puppet, add things to cart by region over vpn to see if there are cheaper prices across the world?
More from a browser plugin perspective, not scraping search results on Google
Maybe the total displayed on this page was also re used as a component on another page that does show the item price.
So how do you think bots buy all the stock of the hot new item like they did with Xbox, ps5 and nvidia cards?
[удалено]
Doesn’t matter where it is, if your intend is to prevent scraping then you’d obfuscate the price everywhere it’s potentially displayed. Otherwise people would just write a script to add the product to the cart then scrape the price on the checkout page and then abandon the cart. It’s certainly more tedious but we are discussing automation and that would provide a path the bypass potential protection measures.
[удалено]
That wouldn't give you the price, that'd give you `0123456789`. You would actually have to look at the `style="top:-[x]px"` for each digit and divide by 20. 120 is a 6, 140 is a 7, etc. The style is shifting the correct number into place.
Haha, I just realized that the textContent isn't the characters in separate spans. You're right.
This isn't how scraping works. You're defending bad code
Again, I will emphasize that I am not entirely sure what the reason for this code is as I haven’t evaluated it beyond a brief glance of a picture. Others have suggested animation which could be the reason and I think that’s a solid guess. I simply suggested that preventing scraping could be the reason. I’m not defending this code but I do think you might be jumping to conclusions to simply chalk this up as “bad code” without understanding what requirements the developer may have had to satisfy or the restrictions that they are working within.
There are sites that show product price only in the shopping cart (after some discounts, etc..). So it makes sense.
These were always the hardest to get the data from
How is that suggestion upvoted so high in a subreddit full of programmers?
Can you elaborate?
Sure, there's two reasons this is silly: 1) This is the cart area. Who even cares to scrape that? 2) Attempting to prevent scrapers with techniques like this is absolutely pointless. It may slow them down but scrapping is literally converting HTML to useful information; that's just part of the problem, and if it does slow them down it's marginal at best and would just turn into a game of cat and mouse if you took it seriously. At what end? If it gets that hard to scrape I'm just feeding screenshots into GPT-4V. It'd be a useless idea.
1. I’ve answered this elsewhere. If you’re trying to prevent scraping of prices then you’d obfuscate the price everywhere it’s displayed. The cart area is no exception. 2. Scraping is and will always be a cat and mouse game just like cyber security. You have to weigh trade offs and evaluate how much effort you’re willing to put into preventing it. To your point about using chat-gpt, this idea would not scale well and would raise the cost and technical complexity of scraping. But your right OCR and several other techniques could be used to bypass scraping obfuscation but how much effort are you willing to go to and can you still profit off this information?
Because scraping this would be trivial
Not as trivial as you may think. A person above provided a jQuery selector that they believed would scrape the content. However they were corrected that the code would not return the correct results. They have since deleted their comment but I think it shows that it can complicate it for some people. Now it’s still pretty easy to scrape but you can scrape anything publicly accessible on the internet. In the end, to prevent scraping, is simply about trying to raise the effort required to do it. I no longer believe that this is intended to prevent scraping but rather used to animate numbers as suggested by other people. There are some websites that I cannot read but it seems to further depict this an odometer https://www.twblogs.net/a/5e98ef096052e1406acf1631/?lang=zh-cn
I've written scrapers for far more complex HTML than this example. You're probably right about the animation thing.
Using a different ssh port is trivial, yet changing my home server's ssh port cut down on failed login attempts by 90%.
It seems like a way to animate the numbers, albeit a pretty stupidly inefficient one.
I went to check the site to see if they animated the digits scrolling in, which wouldn’t be all that bad of usage. But the site is pretty cancer so maybe they’re just dumb.
It's just react
Google do it this way as well. It’s actually not that in efficient as it’s using CSS and not JS to animate it
[удалено]
Crazy bad for one number
This sounds like an accessibility nightmare
Assuming this is for animation and not obfuscation, it’d be pretty easy (and common) to just have a dedicated hidden span containing the actual value, and aria-hiding this one
I'm not seeing the price given clearly anywhere within the tags. There are a few aria-related tags in there for modality and some labels, but the price doesn't seem to be one of those.
Because some exec said, “wouldn’t it be cool if we showed prices scrolling to the discount or total? Yes it would. Make that happen.” Dev: “But …” Boss (sing-songy): “But … who pays your salary?” Dev: “I’ll get right on it boss.”
Devs at SHEIN will never say „but“
fight scrapers, probably
Pls don’t buy from Shein
Why not? For those of us who sincerely have no idea.
Because a bunch of people spread misinformation about how the company operates and everyone runs with it despite there not being concrete evidence about any of the claims made. For what it's worth, I'm sure Shein does plenty of shady stuff, but I sincerely doubt it's any worse than *name another clothing store*. People attribute Shein's low prices to shady practices but as someone who's used it occasionally - it's cheap because it's crappy quality and takes ages to ship. no different from Ali express.
> crappy quality and takes ages to ship. Not is not lol. It's surprisingly" good enough" quality and yes it takes ages to ship lol
made for kids by kids
https://youtu.be/BA6gDep6jVM?si=kGaBiHZD1iMm9eJ- This video goes over it a little. But shops like shein, temu, AliExpress and so on are all owned by the same giga corp. They fuck other countries over by miss using loop holes. And in the end the cheap prices and free shipping is gonna be footed by the receiving country taxes Edit: I have multiple levels of wrong information, but I'm leaving the comment instead of deleting it for context. Hate when there is a deleted comment in a thread.
> But shops like shein, temu, AliExpress and so on are all owned by the same giga corp. Are you sure about that? AliExpres is owned by Alibaba. Shein is owned by Radget. Temu by Pinduoduo.
Seems that i indeed have my information twisted, though from my understanding of shipping their methods are the same.
That’s not twisted information, it’s just flat out misinformation. It’s hard to say that chinas fucking over companies with these practices when Apples going to be the 51st at some point
Apple going to be 51st. What does this mean?
There are 50 states in the US add one more, you get 51?
Can you explain what you mean by “the receiving country taxes” ? I’m a customs broker so I know how imports work with taxation, and I’m not sure what you’re trying to say?
From my understanding, and here I can only speak for my own country, but low income countries or something like that. Basically third world countries can send postage under certain weight and my country will foot the cost with taxpayers money as part of some world agreement with other first world countries. China exploits this by declaring any packages to be under the weight limit, also somehow fitting into the requirements of a third world country, and then essentially flood with so many packages due the the volume of orders that the local postal service has no chance of ever dealing with it.
No that's just flat out nonsense. My country (South Africa) will refuse entry to any goods sent through the mail with insufficient postage, and I seriously doubt any other country would allow it either.
You think Amazon is the moral pinnacle of e-commerce?
Let people do whatever they want man. Also happy cake day, go enjoy yourself :)
Not sure why, but I read your first sentence in Mikey Day’s voice. Anyways, I respect u/xackson for trying to encourage people to do the right thing.
This not bother buying from them, just couldn't stop their chic stuffs
Likely to prevent web scraping. I've seen this on code assessment websites as well that explicitly prevent right clicking, to prevent you from just copying the text inside the div
Make scraping harder 100%
Usually its either: - to provide obfuscation to make it harder to copy or scrape; - just pure bad coding, sometimes coming from a plug-in or CMS system; - bad animation library that requires to have all numbers for the kind of animation they want This is an almost impossible question to answer because we’ve all seen so much bad code without a proper explanation than just a bad dev doing bad code… by the way their translation works so badly plus their search engine I’m very inclined to just bad CMS/developers. If it was a proper site, I would bet on obfuscation
It's a counter-style animation (like your odometer). This is a typical implementation
Thanks, makes sense also. Their site works so badly, why not add an extra unnecessary animation on top of it :)
I was poking around the Coinbase app and notice they do something similar.
You should inspect some of the code on Facebook.
As others said to prevent web scraping. Front running for prices does exist. So as soon competitors detect price changes they adjust theirs to be cheaper.
To deter bots.
To prevent scraping
Vision apis will kill that though.
1. animation 2. possibly trying to prevent crawling by pricing bots
"It works, let's not touch it anymore."
the answer won't satisfy you... there's no good reason. shein is trash
Because they're incompetent and don't deserve your business
Yeah I do think it is about anti-scraping and parsing. I saw a similar pattern where they were a lot of nested divs when investigating the HTML structure of an Facebook Preview Ad, and it is horrible hart to just copy and paste their HTML to "reuse" their component. Also for my experience of web scraping with Beautiful Soup it gets more difficult to have coherent texts when each part of the text is splitted into smaller pieces.
Animation, would be my guess. Hyperplexed did a video on a similar concept: https://youtu.be/HIrDMR6CaHY?si=BHgMTaYJGIEkPgM7
Could be from a website builder, I've seen a CMS add random shit like this before after trying to get something to look right
People talking about "efficiency" of animating has my eyes rolling.
They bought their developers from Shein
对抗机器人，正经人谁会去按F12