Playwright и Puppeteer са два от най-популярните инструменти за автоматизация на браузъра, но те се различават по производителност и възможности. В тази статия ще ги сравним страна по страна, за да ви помогнем да решите кой отговаря на вашите нужди. Въпреки това е важно да запомните, че тъй като уебсайтовете стават все по-трудни за достъп с автоматизирани скриптове, ефективността на кода е само половината от битката. Ето защо ще обсъдим и как могат да помогнат за избягване на прекъсвания и мащабиране на автоматизацията надеждно, с връзки към специални ръководства за интеграция както за двете библиотеки. прокси решенията Какво е Playwright? Playwright е модерна, безплатна рамка, разработена от Microsoft за цялостно тестване и автоматизация на браузъра. Тя позволява на разработчиците да взаимодействат с уеб приложения във всички модерни енджини – Chromium (Chrome & Edge), Firefox и WebKit (енджина на Safari) – на Windows, Linux и macOS. Въпреки че е изграден върху , Playwright поддържа множество програмни езици, включително JavaScript, TypeScript, Python, Java и .NET (C#), което го прави универсален инструмент за екипи с разнообразни технологични стекове. За уеб скрейпинг, способността на Playwright да управлява множество изолирани контексти на браузъра (всеки със собствени бисквитки и прокси настройки) позволява високо ефективно, паралелно извличане на данни без претоварване на паметта от множество процеси на браузъра. Node.js Ключова сила на Playwright е неговата надеждност. Той разполага с автоматично изчакване, което гарантира, че елементите са изпълними, преди да се извърши взаимодействие, значително намалявайки чупливостта на тестовете. Той също така поддържа многоконтекстно браузване, което ви позволява да изолирате множество страници или iframe в една и съща сесия на браузъра. Освен основната автоматизация, той предлага собствено прихващане на мрежата, запис на видео и емулация на мобилни устройства. Въпреки че е сравнително нов в сравнение с Puppeteer, Playwright бързо се превърна в лидер в областта. Неговата способност да доставя последователни, междубраузърни резултати и неговият мощен вграден изпълнител на тестове го правят топ избор за модерна уеб разработка. Какво е Puppeteer? Puppeteer е безплатна библиотека, разработена от Google за автоматизация на браузъри, базирани на Chrome и Chromium. Тя е изградена предимно върху Chrome DevTools Protocol (CDP), давайки на разработчиците контрол върху вътрешността на браузъра, което я прави лека, бърза и високо оптимизирана за задачи, специфични за Chrome. Node.js Puppeteer работи както в безглав, така и в главов режим. Той е стандартен инструмент за уеб скрейпинг, генериране на PDF файлове и автоматично заснемане на екранни снимки. Поради тясната си интеграция с енджина на Chromium, той често получава достъп до нови функции на браузъра преди други рамки за автоматизация. Докато Puppeteer превъзхожда в екосистемата на Chromium (включително Microsoft Edge), неговите междубраузърни възможности са по-ограничени от конкуренти като Playwright. Например, въпреки че сега предоставя стабилна поддръжка за Firefox чрез проекта WebDriver BiDi, той все още няма собствена поддръжка за WebKit (Safari). Puppeteer е създаден специално за екосистемата Node.js и официално поддържа само JavaScript и TypeScript. Въпреки че съществуват неофициални портове като Pyppeteer за Python, тези проекти на общността често нямат чести актуализации, предоставени от основната библиотека. Въпреки тази по-тясна поддръжка на езици, Puppeteer остава един от топ изборите поради своята простота, скорост и голяма подкрепа от общността за автоматизация, фокусирана върху Chrome. Сравнение на Playwright срещу Puppeteer: обобщено За тези, които търсят бърз отговор, ето таблица за сравнение TL:DR Playwright срещу Puppeteer: Функция Playwright Puppeteer Основна цел Междубраузърно E2E тестване, автоматизация и скрейпинг Фокусирана автоматизация и скрейпинг на Chromium Поддържани платформи Windows, macOS, Linux Windows, macOS, Linux Поддръжка на езици JavaScript, TypeScript, Python, Java, .NET (C#) JavaScript & TypeScript Поддръжка на браузъри Chromium, Firefox, WebKit Chromium, Firefox (чрез WebDriver BiDi) Архитектура Драйвер, базиран на WebSocket (абстрахира всички протоколи) Chrome DevTools Protocol (CDP) / WebDriver BiDi Клиент Асинхронен & синхронен Асинхронен Конфигурация на режима Главов & безглав режим (и двата първокласни) Главов & безглав режим (и двата първокласни) Документация Добра; фокус върху тестване & дебъгване Отлична; зряла & проста Поддръжка от общността Огромна екосистема; обширна общност Огромна екосистема; обширна общност Стратегия за изчакване Автоматично изчакване (вградена надеждност) Ръчно изчакване (изисква ) waitForSelector Сравнение на поддръжката на браузъри Най-видимото предимство на Playwright е неговата собствена поддръжка за трите основни енджина на браузъри: Chromium, Firefox и WebKit. Последният прави Playwright предпочитан избор за разработчици, които трябва да гарантират, че техните уеб приложения работят перфектно на iOS или macOS, тъй като може да симулира поведението на Safari чрез WebKit на всяка операционна система. За разлика от това, Puppeteer остава библиотека, фокусирана върху Chromium. Въпреки че е стабилизирал и официално стартира първокласна поддръжка за Firefox чрез протокола WebDriver BiDi, той все още няма собствена поддръжка за WebKit. Ако се нуждаете от тестване за Safari или търсите междубраузърно изживяване, Playwright все още е ясният победител. Двете библиотеки също се различават по начина, по който контролират браузърите. Playwright доставя свои собствени „поправени“ версии на браузърни бинарни файлове. Тези кръпки позволяват на Playwright да разкрива нисконивови API, които не са налични в стандартните браузъри. Той също така позволява функции като автоматично изчакване и разширено прихващане на мрежата. Има обаче уловка. Тъй като тези браузъри са модифицирани, съществува теоретичен риск тестът да премине в поправен браузър Playwright, но да се провали в истински браузър. Puppeteer, от друга страна, първоначално изгради репутацията си върху Chrome DevTools Protocol (CDP). Днес той се движи към WebDriver BiDi, нов индустриален стандарт. Това по същество означава, че Puppeteer работи по-тясно с предоставените от производителя стандартни версии на браузъри, което често се превръща в по-добра дългосрочна стабилност и по-нисък риск от фалшиви положителни резултати по време на тестване. Опции за програмни езици Инструментът е толкова полезен, колкото и неговата съвместимост със съществуващия опит на вашия екип. Ето защо, когато става въпрос за избор на програмен език, изборът между Playwright и Puppeteer се свежда до вашия технологичен стек. Playwright е проектиран с полиглотна философия – той е създаден, за да бъде достъпен за почти всеки модерен екип за разработка. Въпреки че основният енджин е написан на TypeScript/ , Microsoft предоставя и поддържа висококачествени езикови връзки за JavaScript, TypeScript, Python, Java и C#/.NET. Нещо повече, тъй като това са официални връзки, вие получавате съответствие на функции във всички езици – функция, пусната за , е почти незабавно достъпна за потребители на Python или Java. Node.js Node.js Puppeteer, от друга страна, е строго библиотека, предназначена за JavaScript и TypeScript. Ако работите в екосистемата на JS, Puppeteer ще се почувства като естествено разширение на работния ви процес. Но ако сте Python разработчик, сте много по-скоро извън късмета си с официалната библиотека Puppeteer. Да, има неофициални портове като Pyppeteer за Python, но те са само проекти, поддържани от общността, които вече не се поддържат. Node.js Процес на инсталиране и настройка Сега нека да разгледаме как можем да използваме както Playwright, така и Puppeteer, за да извършим основна задача за уеб скрейпинг. Предварителни изисквания За да започнете, ще трябва да инсталирате (Node Package Manager) на вашата машина. Можете да направите това, като следвате тази . npm връзка След това можете да отворите терминала си и да изпълните тези команди, за да създадете нова папка и да инициализирате нов Node проект. Това обикновено създава файл в директорията. package.json mkdir playwright-pupeteer cd playwright-pupeteer npm init -y Инсталиране на библиотеките След като проектът е настроен, нека инсталираме както Playwright, така и Puppeteer в текущия проект. Можете да направите това, като изпълните тези команди: npm install puppeteer npm install playwright npx playwright install Както виждате, трябва да изпълним допълнителна команда при инсталиране на Playwright. Това е така, защото Playwright не включва браузър в пакета по подразбиране. Трябва да изпълните последната показана команда, за да инсталирате предоставените от него браузъри по подразбиране. npx playwright install Puppeteer, от друга страна, има вграден Chrome по подразбиране; следователно не е необходима допълнителна команда. Скрейпинг на уебсайт с Playwright След като настройката ни приключи, нека разгледаме как можете да използвате Playwright, за да скрейпнете уебсайт. Ще използваме като цел за скрейпинг за този пример. Тъй като sandbox имитира сайт за електронна търговия, ще скрейпнем заглавието и статуса на наличност на всеки артикул на страницата. Oxylabs Sandbox Нека започнем със създаването на JavaScript файл, наречен , в папката на вашия проект. След като го имате, трябва да импортирате зависимостта от пакета Playwright. Ето как трябва да изглежда: playwright.js chromium import { chromium } from 'playwright'; След това, нека извършим първоначалните стъпки на повечето приложения Playwright: отваряне на браузъра и навигиране до уебсайт. Можем да започнем, като дефинираме URL адреса на sandbox за скрейпинг в променлива, както следва: const URL = 'https://sandbox.oxylabs.io/products'; Сега, нека стартираме браузър и отворим нова страница, както следва: const browser = await chromium.launch(); const page = await browser.newPage(); След като имаме инициализирана променлива page, можем да започнем процеса на скрейпинг. Добавете тези редове, за да навигирате страницата до предварително дефинирания URL: await page.goto(URL); await page.waitForLoadState('networkidle'); Вторият ред гарантира, че всички компоненти са заредени, преди да започнем скрейпинга, така че да не пропуснем необходимите данни. Сега, след като данните са заредени, можем да използваме прост CSS селектор, за да изберем всеки продукт от уебсайта. Всеки продукт в sandbox има CSS клас , така че нека го използваме като наш селектор. .product-card За да направим това, нека създадем анонимна функция за метода на обекта page, която в крайна сметка връща всеки продукт от скрейпнатите данни. Тя трябва да изглежда така: evaluate const products = await page.evaluate(() => { }) Вътре в анонимната функция, нека заявка за всяка продуктова карта, както следва: const products = await page.evaluate(() => { const productCards = document.querySelectorAll('.product-card'); }) След това трябва да итерираме върху всяка продуктова карта и да картографираме заглавието и статуса на наличност в нов обект. Тъй като статусът на наличност няма общ CSS клас, ще изберем текста и отделно и ще ги сравним, за да определим кой съществува. Ето как трябва да изглежда: Out of Stock In Stock const products = await page.evaluate(() => { const productCards = document.querySelectorAll('.product-card'); return Array.from(productCards).map(card => { const inStock = card.querySelector('p.in-stock')?.innerText; const outOfStock = card.querySelector('p.out-of-stock')?.innerText; const title = card.querySelector('h4.title')?.innerText; return { title: title, stockStatus: inStock ? 'In Stock' : outOfStock ? 'Out of Stock' : '' }; }); }) След това можем да изведем върнатите продукти с прост израз за запис и да затворим браузъра, както следва: console.log(products); await browser.close() Ако стартирате кода, трябва да видите нещо подобно на това в терминала си: [ { title: 'The Legend of Zelda: Ocarina of Time', stockStatus: 'In Stock' }, { title: 'Super Mario Galaxy', stockStatus: 'Out of Stock' }, { title: 'Super Mario Galaxy 2', stockStatus: 'In Stock' }, { title: 'Metroid Prime', stockStatus: 'Out of Stock' }, { title: 'Super Mario Odyssey', stockStatus: 'In Stock' }, { title: 'Halo: Combat Evolved', stockStatus: 'Out of Stock' }, ... ] Ето как трябва да изглежда пълният скрипт: import { chromium } from 'playwright'; const URL = 'https://sandbox.oxylabs.io/products'; const browser = await chromium.launch(); const page = await browser.newPage(); await page.goto(URL); await page.waitForLoadState('networkidle'); const products = await page.evaluate(() => { const productCards = document.querySelectorAll('.product-card'); return Array.from(productCards).map(card => { const inStock = card.querySelector('p.in-stock')?.innerText; const outOfStock = card.querySelector('p.out-of-stock')?.innerText; const title = card.querySelector('h4.title')?.innerText; return { title: title, stockStatus: inStock ? 'In Stock' : outOfStock ? 'Out of Stock' : '' }; }); }); console.log(products); await browser.close(); След това, нека разгледаме как ще извършим същата задача, използвайки Puppeteer. Скрейпинг на уебсайт с Puppeteer За да започнете, нека създадем друг файл в същата директория, наречен . puppeteer.js След като го имате, можете да го отворите и да импортирате библиотеката . Както споменахме по-рано, Puppeteer пакетира Chrome, така че не е нужно да импортираме допълнителна зависимост за браузър. Импортирането на по този начин е достатъчно: puppeteer puppeteer import puppeteer from "puppeteer"; Останалата част от скрипта остава предимно същата като в примера с Playwright, с изключение на някои малки разлики. Както преди, стартираме браузър, отваряме страница, навигираме до URL адреса на sandbox за скрейпинг и скрейпваме данните. Ето как трябва да изглежда: import puppeteer from "puppeteer"; const URL = "https://sandbox.oxylabs.io/products"; const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto(URL); await page.waitForNetworkIdle(); const products = await page.evaluate(() => { const productCards = document.querySelectorAll(".product-card"); return Array.from(productCards).map((card) => { const inStock = card.querySelector("p.in-stock")?.innerText; const outOfStock = card.querySelector("p.out-of-stock")?.innerText; const title = card.querySelector("h4.title")?.innerText; return { title: title, stockStatus: inStock ? "In Stock" : outOfStock ? "Out of Stock" : "", }; }); }); console.log(products); await browser.close(); Прилики и разлики Единствената разлика между тези примери е начинът, по който всяка библиотека обработва изчакването на промяна на състоянието на мрежата. В Playwright трябва изрично да посочим кое състояние на мрежата чакаме в аргумента на метода, както следва: await page.waitForLoadState("networkidle"); Докато Puppeteer предоставя отделен метод за изчакване на мрежата да стане неактивна, както следва: await page.waitForNetworkIdle(); Разбира се, повече разлики ще станат явни, докато се справяте с по-напреднали случаи на употреба. Въпреки това, този малък пример показва, че освен някои функционални разлики, както Playwright, така и Puppeteer изпълняват едни и същи основни задачи по подобен начин. Дизайн на API и лекота на използване Ако някога сте писали скрипт за браузър, който работи перфектно на вашата машина, но случайно се проваля в облака, сте преживели чупливост. Начинът, по който и двете тези библиотеки обработват времето за зареждане на страницата, е най-големият фактор за това колко разочароващ (или гладък) ще бъде вашият процес на разработка. Playwright е създаден, за да реши проблема с чупливостта, въвеждайки две концепции: – в повечето инструменти за автоматизация, ако кажете на скрипта да „кликне върху бутона за вход“, той може да се опита да кликне върху него, преди бутонът да е завършил зареждането, причинявайки срив на скрипта. Playwright автоматично изчаква елементът да бъде изпълним – той проверява дали бутонът е видим, стабилен и активиран – преди да се опита да кликне. Автоматично изчакване – локаторът е начин за описание как да се намери елемент (например „намери бутона, който казва Подаване“). За разлика от по-стари методи, които намират елемент веднъж и след това го губят, ако страницата се презареди, Playwright Locator остава активен и ще намери отново елемента, когато ви е необходим. Локатори Puppeteer е по-ръчен – той ви дава инструментите за взаимодействие с браузъра, но не прави толкова много тежка работа вместо вас. Например, в Puppeteer трябва да кажете на скрипта точно кога да изчака. Малко по-късно ще пишете нещо като преди почти всяко действие. Ако забравите команда за изчакване или сайтът зарежда по-бавно от обикновено, скриптът ви вероятно ще се провали. Така че, може да получите повече контрол, но също така трябва да напишете повече редове код, за да обработите същите задачи, които Playwright обработва автоматично. await page.waitForSelector('.login-btn') Производителност & скорост Няма единна международно приета опция, когато става въпрос за най-бързата библиотека, тъй като тя зависи изцяло от мащаба на вашия проект. Въпреки това, и двата инструмента са определено по-бързи от по-стари рамки, като Selenium, но имат различни профили на производителност. Puppeteer често е идеален за кратки, еднократни скриптове или проекти. Тъй като е лека библиотека с директна, нисконивова връзка с Chromium, тя има много малко претоварване. Като се има предвид скоростта на стартиране, Puppeteer може да стартира браузър и да изпълни проста команда (например да направи екранна снимка на една страница) по-бързо от Playwright в много бенчмаркове. Защо? Защото няма допълнителни слоеве, които Playwright използва, за да поддържа множество езици и типове браузъри. Така че, ако целта ви е да изпълнявате хиляди малки и независими задачи, Puppeteer е труден за победа. Обратно, Playwright е много по-ефективен в сложни, многостранични сценарии благодарение на функцията си BrowserContexts. Нека я сравним с Puppeteer: в Puppeteer, ако искате да изпълните 10 различни сесии за скрейпинг с пълна изолация, трябва да стартирате 10 отделни процеса на браузъра. Този процес се счита за тежък и консумира значителна RAM. Playwright ви позволява да стартирате един процес на браузъра и да създадете десетки изолирани контекста в него – всеки контекст се държи като напълно нов прозорец на браузъра, но споделя същата основна памет. В резултат на това Playwright използва значително по-малко процесорно време и памет от Puppeteer при мащабиране при голям обем. Документация & поддръжка от общността Puppeteer е индустриален стандарт от дълго време, но Playwright бързо постави нова летва за това как трябва да бъдат документирани инструментите за разработчици. Puppeteer, считан за зрял ветеран, има предимство от няколко години, което му помогна да създаде огромна база от знания в интернет. Например, ако срещнете странна грешка в Puppeteer, има голям шанс някой друг да я е решил преди три години в Stack Overflow или GitHub. В допълнение, тъй като Puppeteer съществува от толкова дълго време, общността е създала специализирани инструменти, които не се поддържат официално. Като цяло, документацията на Puppeteer е ясна – това е библиотека и нейните документи отразяват тази простота. Въпреки че Playwright е по-млад, той е подкрепен от огромните ресурси на Microsoft. Неговата документация не просто ви казва как да кликнете върху бутон – тя предоставя подробни, илюстрирани ръководства за съвременни предизвикателства. Тъй като Playwright включва първокласни инструменти, плъгините на общността са по-малко необходими. Безопасно е да се каже, че днес Playwright е изпреварил Puppeteer в осигуряването на предпазна мрежа за разработчици – докато Playwright може да има по-малко стари нишови блог публикации, неговата официална документация е толкова изчерпателна, че рядко се налага да търсите другаде. Възможности за уеб скрейпинг Съвременните уебсайтове рядко са само статичен HTML – те са динамични приложения, които зареждат данни, докато превъртате или кликвате. За ефективно скрейпване на тези уебсайтове се нуждаете от инструмент, който може да мисли и действа като реален човешки браузър. И докато Playwright и Puppeteer са отлични в извличането на данни, те представляват различни стратегии. Обработка на динамично съдържание И двете библиотеки обработват добре съдържание, интензивно използващо JavaScript, но се различават по начина, по който чакат данни. Поради вграденото си автоматично изчакване, Playwright е устойчив при скрейпинг на сайтове, които зареждат данни с непредсказуеми скорости. Той няма да се опита да скрейпне заглавие на продукт или цена, докато те не бъдат напълно визуализирани и видими, което прави вашите скрейпъри по-малко вероятно да се сринат по време на пик на бавна мрежа. Puppeteer ви дава контрол. Ако трябва да прихванете конкретна мрежова заявка в момента, в който се случи, интеграцията на Puppeteer с Chrome DevTools Protocol (CDP) предоставя нивото на контрол, което напредналите разработчици изискват. Мащабиране Когато трябва да скрейпнете 10K страници, производителността се свежда до числа. Playwright, със своята функция BrowserContext, като цяло е победител за мащаб: можете да изпълнявате стотици изолирани сесии за скрейпинг в рамките на един процес на браузъра, подобрявайки ефективността на скрейпинга. Puppeteer често е по-бърз за прости, едностранични извличания: ако просто трябва да вземете една част от данни от една страница възможно най-бързо, по-ниското претоварване на Puppeteer му дава леко предимство в скоростта. Блокове Повечето големи уебсайтове използват сложни мерки за откриване на автоматизирани скриптове. Ето защо, в наши дни, най-голямото предизвикателство при уеб скрейпинга не е кодът – а блоковете. Докато Puppeteer има „Stealth“ плъгин, поддържан от общността, и Playwright ви позволява да използвате Firefox или WebKit, за да заобиколите проследяването, специфично за Chrome, една библиотека сама по себе си често не е достатъчна. За скрейпинг с голям обем, библиотеката е просто волан – за да се движите действително, ви е нужен двигател. Професионални услуги като Oxylabs предоставят инфраструктурата и технологията за отключване, необходими за заобикаляне на CAPTCHA и управление на браузърни пръстови отпечатъци в мащаб. Тези услуги позволяват на вашите скриптове Playwright или Puppeteer да се свързват към отдалечен отключващ браузър, който управлява сложността на преодоляването на мерките срещу ботове вместо вас. Поддръжка на прокси, интеграция и конфигурация В автоматизацията на браузъра, прокситата
