devLap

Web Scraping vs Browserextensies: Wanneer Gebruik Je Wat voor Data-extractie

python dev.to

Je hebt data van een website nodig. Schrijf je een Python-scraper? Start je Playwright op? Gebruik je een browserextensie? Na het extraheren van data van honderden verschillende sites heb ik een framework ontwikkeld om de juiste tool te kiezen.

De Opties

Aanpak Draait op JS-ondersteuning Login-support Opzettijd
Python + requests Server ❌ Handmatige cookies 5 min
Python + BeautifulSoup Server ❌ Handmatige cookies 5 min
Playwright/Puppeteer Server ✅ Scriptbaar 15 min
Browserextensie Browser gebruiker ✅ Automatisch 0 min
Kopiëren-plakken Browser gebruiker ✅ Automatisch 0 min

Elke optie heeft afwegingen. Laten we ze doornemen.

Optie 1: Python + Requests/BeautifulSoup

Beste voor: Statische HTML-pagina's, API's, geautomatiseerde pipelines

import requests
from bs4 import BeautifulSoup

response = requests.get("https://example.com/data")
soup = BeautifulSoup(response.text, "html.parser")

table = soup.find("table")
rows = []
for tr in table.find_all("tr"):
    row = [td.get_text(strip=True) for td in tr.find_all(["td", "th"])]
    rows.append(row)
Enter fullscreen mode Exit fullscreen mode

Voordelen:

  • Snelle uitvoering
  • Eenvoudig te plannen (cron, Airflow)
  • Geen browseroverhead

Beperkingen:

  • Voert geen JavaScript uit
  • Veel moderne sites renderen tabellen client-side
  • Authenticatie vereist handmatige cookie-afhandeling

Wanneer het faalt: Probeer een React-dashboard te scrapen. De HTML die je krijgt is een lege <div id="root"></div>.

Optie 2: Headless Browsers (Playwright/Puppeteer)

Beste voor: JavaScript-gerenderde pagina's, geautomatiseerde pipelines, sites die interactie vereisen

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com/dashboard');

  // Wacht tot de tabel gerenderd is
  await page.waitForSelector('table');

  const data = await page.evaluate(() => {
    const table = document.querySelector('table');
    return Array.from(table.rows).map(row =>
      Array.from(row.cells).map(cell => cell.textContent.trim())
    );
  });

  console.log(data);
  await browser.close();
})();
Enter fullscreen mode Exit fullscreen mode

Voordelen:

  • Voert JavaScript uit
  • Kan met pagina's interageren (klikken, scrollen, formulieren invullen)
  • Scriptbare authenticatieflows

Beperkingen:

  • Langzamer dan directe HTTP
  • Veel resources nodig (geheugen, CPU)
  • Complexere foutafhandeling
  • Sites kunnen headless browsers detecteren

Wanneer het faalt: Veel sites detecteren Puppeteer/Playwright via navigator-eigenschappen, WebGL-fingerprinting of gedragsanalyse. Stealth-plugins helpen, maar zijn niet waterdicht.

Optie 3: Browserextensies

Beste voor: Ad-hoc extractie, beveiligde sites, gebruiker-geïnitieerde workflows

Een browserextensie draait in de werkelijke browsersessie van de gebruiker, met volledige toegang tot:

  • Geauthenticeerde sessies
  • JavaScript-gerenderde inhoud
  • Exact dezelfde DOM die de gebruiker ziet

Bekijk de vergelijking in De 5 Beste Chrome-extensies voor het Exporteren van Tabellen.

// Content script in een Chrome-extensie
chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
  if (msg.type === "EXTRACT_TABLE") {
    const table = document.querySelector("table");
    const data = Array.from(table.rows).map(row =>
      Array.from(row.cells).map(cell => cell.textContent.trim())
    );
    sendResponse({ data });
  }
});
Enter fullscreen mode Exit fullscreen mode

Voordelen:

  • Geen authenticatie-afhandeling nodig — je bent al ingelogd
  • Ziet precies wat jij ziet (geen JS-renderingproblemen)
  • Werkt op elke site (geen botdetectie)
  • Geen serverinfrastructuur nodig

Beperkingen:

  • Vereist handmatige trigger (gebruiker klikt)
  • Kan niet ingepland worden
  • Beperkt tot browsercontext

Wanneer het faalt: Je moet data van 10.000 pagina's automatisch extraheren. Extensies zijn voor gebruiker-geïnitieerde workflows, niet voor batchverwerking.

Keuzeframework

Gebruik Python + requests wanneer:

  • ✅ De pagina server-gerenderd HTML is
  • ✅ Je geautomatiseerde/geplande extractie nodig hebt
  • ✅ Je een datapipeline bouwt
  • ✅ Authenticatie via API-keys of eenvoudige cookies gaat

Gebruik Playwright/Puppeteer wanneer:

  • ✅ De pagina JavaScript-rendering vereist
  • ✅ Je geautomatiseerde/geplande extractie nodig hebt
  • ✅ Je moet interageren (scrollen, klikken, pagineren)
  • ✅ Je botdetectie-tegenmaatregelen kunt afhandelen

Gebruik een Browserextensie wanneer:

  • ✅ Je al ingelogd bent op de site
  • ✅ Je af en toe data nodig hebt (niet geautomatiseerd)
  • ✅ De site sterke botdetectie heeft
  • ✅ Je data NU wilt zonder code te schrijven

Gewoon kopiëren-plakken wanneer:

  • ✅ Eenmalige extractie
  • ✅ Eenvoudige tabelstructuur
  • ✅ Je het niet in een specifiek formaat nodig hebt

Praktijkvoorbeelden

Voorbeeld 1: Wikipedia-tabellen

Beste aanpak: Browserextensie of Python

Wikipedia is server-gerenderd HTML zonder authenticatie. Python werkt prima:

import pandas as pd

url = "https://en.wikipedia.org/wiki/List_of_countries_by_population"
tables = pd.read_html(url)
df = tables[0]
Enter fullscreen mode Exit fullscreen mode

Maar Wikipedia-tabellen hebben vaak complexe rowspans en navigatierijen. Een specifieke extensie handelt deze automatisch af.

Voorbeeld 2: Financieel Dashboard (Achter Login)

Beste aanpak: Browserextensie

Je broker toont portfoliodata na inloggen. Opties:

  1. Python: Reverse-engineer de authenticatieflow, handel 2FA af, onderhoud sessiecookies. Mogelijk maar fragiel.

  2. Playwright: Script de login, handel 2FA-prompts af, navigeer naar de data. Werkt maar complex.

  3. Extensie: Log normaal in, klik "Tabel Exporteren." Klaar.

Voor incidentele exports wint de extensie op tijd-tot-data.

Voorbeeld 3: Dagelijkse Prijsmonitoring (1000 Pagina's)

Beste aanpak: Playwright + wachtrij

Je moet prijzen op 1000 productpagina's dagelijks controleren. Dit vereist:

// Pseudocode voor batch-extractie
const urls = loadUrlsFromDatabase();

for (const url of urls) {
  const page = await browser.newPage();
  await page.goto(url);
  await page.waitForSelector('.price');

  const price = await page.evaluate(() => 
    document.querySelector('.price').textContent
  );

  await saveToDatabase(url, price);
  await page.close();

  // Snelheidsbeperking
  await sleep(randomBetween(1000, 3000));
}
Enter fullscreen mode Exit fullscreen mode

Extensies kunnen dit niet — ze vereisen gebruikersinteractie. Playwright is hier de juiste tool.

Voorbeeld 4: Eenmalige Sportstatistieken-export

Beste aanpak: Browserextensie

FBREF heeft complexe headers met twee niveaus. Je hebt dit seizoens stats eenmalig nodig.

Python-aanpak: 30 minuten een aangepaste parser schrijven voor hun tabelstructuur.

Extensie-aanpak: Klik op exporteren. 10 seconden.

Voor eenmalige extractie: niet over-engineeren.

Hybride Aanpakken

Soms heb je allebei nodig:

  1. Gebruik extensie om authenticatiecookies te exporteren

    • Exporteer cookies vanuit een ingelogde sessie
    • Importeer in Python/Playwright voor automatisering

  2. Gebruik extensie om structuur te inspecteren, Python om op te schalen

    • Bekijk de DOM handmatig met extensietools
    • Schrijf een gerichte scraper zodra je de structuur begrijpt

  3. Gebruik Playwright voor navigatie, extensie voor extractie

    • Script navigeert naar de pagina
    • Roept extensie-API aan voor complexe tabelparsing

Mijn Stack

Voor de 80% van de gevallen waarin ik webtabeldata nodig heb:

  • Eenmalig, geauthenticeerd: HTML Table Exporter (browserextensie die ik heb gebouwd)
  • Eenmalig, openbare data: pd.read_html() of extensie
  • Geautomatiseerde pipeline: Playwright met aangepaste parsers
  • API beschikbaar: Directe API-aanroepen (altijd de voorkeur)

De beste tool hangt af van de specifieke extractie. Pas de complexiteit van je oplossing aan op de complexiteit van je probleem.

Wat is jouw favoriete extractie-aanpak? Meer info op gauchogrid.com/nl/html-table-exporter of probeer de extensie gratis in de Chrome Web Store.

Source: dev.to

arrow_back Back to Tutorials