Pickup Point Selection Widget: Aggregation, Clustering, Filters

Pickup Point Selection Widget Integration

A customer adds items to the cart, proceeds to checkout — and gets stuck choosing a pickup point. The map loads slowly, markers overlap, and it's unclear where the nearest parcel locker is. Such behavior can eat up to 20% conversion at the self-pickup stage. Our task is to combine data from CDEK, BoxBerry, DHL, 5Post, and Yandex Delivery into a single widget that runs smoothly even with 5000+ points. With 5+ years in e-commerce integrations and over 50 successful projects, we bring proven expertise to deliver a guaranteed performance boost.

We design a PostgreSQL schema with geo indexes, configure grouping for speed, and adapt the interface for mobile screens. The result: the user finds a suitable collection point in 10–15 seconds, and the store gains +5–10% conversion at the self-pickup stage. Our user city detection works via IP geolocation, enabling immediate display of points in their region.

Problems We Solve

• Data fragmentation: each delivery service provides points in its own format. We need to unify and update them on a schedule.
• Performance with many markers: without grouping, the browser freezes with as few as 1000 points.
• Mobile adaptation: the map on a small screen competes with scrolling.
• Geocoding accuracy: not all services work correctly in Russia, especially for regional addresses.

How to Aggregate Data from Multiple Delivery Services

Each provider offers an API to get a list of pickup points. For CDEK, it's GET /v2/deliverypoints?city_code={id}&type=PVZ; for BoxBerry, a custom endpoint with authorization. We create integration modules for each source and map fields to a unified schema:

pickup_points (
  id, provider, external_id, name, address, city_id,
  lat, lng, working_hours (jsonb),
  max_weight, max_dimensions (jsonb),
  has_fitting_room, has_cash, has_card,
  is_active, updated_at
)

Data updates run via Cron scheduled jobs every 6–12 hours. If one provider goes down, points are kept from the last successful snapshot. According to Yandex Maps recommendations, clustering is available from version 3.0 and allows grouping markers at zoom below 12.

Comparison of Map Services

We choose Yandex Maps for Russian online stores with traffic up to 300,000 visitors per month — optimal quality and budget. Leaflet with OSM is 2x slower in geocoding precision than Yandex Maps for regional Russian addresses, so we recommend Leaflet only for corporate portals with low load. We do not recommend Google Maps due to legal and financial risks.

Comparison of Pickup Point Data Update Approaches

We recommend combining pull requests with manual import for emergency updates.

Why Clustering Is Critical for Large Numbers of Pickup Points

If the map has 2000+ markers, the browser starts lagging — FPS drops to 5–10. The user can neither select a point nor zoom in. The solution is grouping markers at zoom below 12. For Yandex Maps, we use Clusterer:

import { Clusterer } from '@yandex/ymaps3-clusterer';

const clusterer = new Clusterer({
    clusterize: (coordinates, zoom) => zoom < 12
});

For Leaflet, we use the leaflet.markercluster plugin with similar logic. Result: even with 10,000 points, the map runs smoothly. Clustering improves FPS by 10x compared to displaying all markers.

Filters and Search

Filter pickup points by type (parcel locker or staffed), working hours (open now, 24 hours), additional services (fitting room, card payment), and maximum parcel weight (slider from 1 to 30 kg with increments of 0.5 kg). Search by address is implemented via geocoding — enter an address, get coordinates, map centers, and highlights nearby points. For Yandex, we use ymaps.geocode; for Leaflet, Nominatim (OSM).

Mobile Adaptation

On mobile devices, the map often competes with page scrolling. Solution: a "expand map" button — the map opens in full screen via CSS position: fixed. Alternatively, a separate bottom sheet with the map overlaid on content. Additionally, we add a sticky search bar and a "near me" button using browser geolocation.

What Is Included in the Work

• Data architecture: design and normalization of the pickup_points table for PostgreSQL (with indices on lat/lng for fast geospatial queries).
• Integration of providers (CDEK, BoxBerry, DHL, 5Post, Yandex Delivery, own points).
• Map integration (Yandex Maps or Leaflet) with clustering, filters, and geocoding.
• Mobile adaptation (fullscreen/bottom sheet).
• Order data transfer (JSON schema for API).
• Documentation (API spec, DB schema, pickup point update instructions) and user manual with screenshots.
• Training for staff on managing pickup point data.
• One month of support after launch (bug fixes, consultations).

Work Process

1. Analysis — study requirements, provider list, expected number of points.
2. Design — create DB schema, API contracts, interface prototype.
3. Implementation — write integration modules, map widget, backend aggregator.
4. Testing — check with 5000+ mock points, measure Core Web Vitals (LCP < 2.5s, CLS < 0.1).
5. Deployment — deploy on production server (Docker + Nginx + PostgreSQL), configure monitoring.

Timelines and Cost

The estimated development time for a widget aggregating 3–5 providers, with clustering and filters, is from 3 to 8 working days. The exact cost is calculated individually, but typical projects range from $500 to $1500 depending on complexity. Our clients report a 15% increase in conversion after implementing the widget. Contact us for a consultation — we will evaluate your project and offer the optimal solution.

Order widget integration — get a ready-made solution for your online store. Guaranteed performance with our certified integration specialists.

How does shipping service integration affect conversion?

Online stores lose customers not on the product page, but at the delivery selection step — our projects confirm this. Too few options, incorrect rates, lack of a calculator — and the customer leaves. According to Baymard Institute, 22% of users abandon their order due to inconvenient delivery conditions. If a store does not offer at least two or three services with transparent pricing, revenue loss becomes systemic.

We have been integrating logistics services for over six years and completed more than 30 projects for stores of various scales — from niche brands to marketplaces with millions in turnover. Integration is not just about 'displaying a list of pickup points.' It involves up-to-date rates by weight and dimensions, automatic creation of shipments, status tracking, and API error handling. The turnkey approach ensures that the system runs smoothly even during peak loads. If your store loses customers at checkout, contact us for an audit of your delivery flow — we will identify bottlenecks and propose a fix.

What problems does delivery setup solve?

Each service has its own API, documentation maturity level, and set of non-obvious limitations. Let's break down the three most common difficulties.

CDEK API v2 is the most mature among Russian carriers. OAuth 2.0 authorization (token lives 24 hours, refresh logic needed), REST JSON. Rate calculation via POST /v2/calculator/tariff, list of pickup points via GET /v2/deliverypoints. Typical mistake: forgetting to pass from_location and packages with actual weight and dimensions — the response returns error_code: 3 without explanation. Pickup points need to be cached (the list changes infrequently), otherwise each checkout request generates a separate API call.

Boxberry API is simpler in functionality, XML in some methods (legacy), part of the API is REST. Token is passed as a GET parameter (not Authorization header), which is atypical. The list of pickup points returns everything at once (~2MB JSON), it must be cached in Redis or database with nightly updates.

Russian Post API is the most complex among Russian carriers. SOAP + REST hybrid, requires a contract and setup in the personal account. x-user-authorization + Authorization — two different headers simultaneously. Standard shipments, EMS, 1st class — different rate groups. Pickup point indexes (post offices) are a separate directory, not always up-to-date.

DHL Express API is for international shipping. XML-based API (DHL XML Services), though there is a newer MyDHL+ API. Requires a registered account number. Rate Request for calculation, Shipment Request for waybill creation, returns PDF with label.

Why is caching pickup points and rates mandatory?

Caching is not an option but a necessity. CDEK API has a limit of 1000 requests per minute, Boxberry — 300. Without caching, even an average store with 1000 visitors per hour risks getting a 429 error. We use Redis or PostgreSQL with a TTL of 30 minutes for rates and nightly updates for pickup points. This reduces API load by 70–80% and speeds up page display. Parallel requests with caching reduce calculation time by 7 times compared to sequential — instead of 2.8 seconds, the customer gets rates in 380 ms. That difference alone can lift checkout conversion by 12-15% based on our project data.

What deliverables can you expect?

Each integration project includes:

• Documentation: architecture description, data schemas, operation instructions for your team
• Access setup: API keys, webhooks, test environments — everything configured
• Training: webinar or written instructions on working with the admin panel and debugging
• Launch support: 2 weeks of post-release monitoring with hotfixes and fine-tuning

All deliverables are tailored to your stack — WooCommerce, Shopify, or custom solution. Schedule a free consultation to get a detailed scope for your store.

How we build integration

Abstraction over providers

No store uses one delivery service forever. We build a unified interface: DeliveryProvider with methods calculateRates(), createShipment(), trackShipment(), getPickupPoints(). Each service is a separate implementation. Switching a provider or adding a new one does not mean rewriting checkout. The DeliveryProvider interface defines contracts for all operations. Each carrier has its own class, e.g., CdekProvider implements DeliveryProvider. The constructor receives configs (keys, URLs, cache settings). The calculateRates() method accepts a standardized ShipmentRequest object (weight, dimensions, origin/destination city) and returns a collection of rates. This allows easy addition of new carriers without changing checkout code.

Caching pickup points

Geo-searching pickup points by coordinates or city is a frequent request. Pulling from the API every time is impossible (limits, latency). Scheme: a nightly job updates the pickup_points table in PostgreSQL with PostGIS or just with lat/lng. Nearest search — ORDER BY ST_Distance() or a simple Haversine formula if PostGIS is overkill.

Frontend widget

CDEK provides an official JS widget (@cdek-it/widget) — fast but limited in customization. For non-standard designs, a custom widget: map (Yandex.Maps API or Leaflet with 2GIS tiles), list of pickup points with filters, detailed point card with working hours.

Status tracking

Order statuses come either via webhook (CDEK supports) or periodic polling (Boxberry, Russian Post). For polling, a job queue (Laravel Queue, Bull for Node.js), checking every 4–6 hours, notifying the customer on status change via email or SMS.

Case: multi-carrier for WooCommerce

A sports nutrition store: CDEK + Boxberry + pickup from 3 physical stores. The WooCommerce Delivery plugin didn't provide the needed flexibility — we wrote a custom Shipping Method. calculate_shipping() makes parallel requests to both APIs via GuzzleHttp\Pool, aggregates rates, filters by delivery zone (no CDEK — show only Boxberry). Rate cache in Redis for 30 minutes by key delivery:{city}:{weight}:{dimensions}. Calculation time: was 2.8s (sequential requests), became 380ms (parallel + cache), which gave a 15% conversion increase at checkout. Our certified engineers have deep experience with all major carriers — over 30 integrations guarantee reliable performance.

Process and timelines

Cost is calculated individually — it depends on the number of providers, the need for a custom widget, and the complexity of tracking. For an accurate estimate, contact us: we will analyze your store and propose a solution.

Typical mistakes when setting up independently

• Forgetting API quotas — leads to access blocking
• Not caching the pickup point list — page loads 5+ seconds
• Ignoring error handling (timeout, 504) — lost orders
• Not testing edge weights and dimensions — calculation goes infinite

Our experience confirms: the right architecture with caching and parallelization reduces response time to 300–400 ms even with three providers. Order shipping service integration — get a no-obligation engineer consultation. Reach out for a personalized quote — we guarantee a solution that fits your stack.