>_ DevTrendsfr

Langue

Accueil

Langages

Sections

Frontend Backend Mobile DevOps AI / ML GameDev Blockchain Embarqué Sécurité
TypeScript

Comment arrêter de chercher des processus via lsof et ranger vos ports

Situation familière : vous lancez un serveur local et le terminal crache une erreur douloureusement familière Error: listen EADDRINUSE: address already in use :::3000. Le worker d'hier ne s'est pas terminé correctement, un processus en arrière-plan s'est bloqué, ou un conteneur Docker maintient silencieusement le socket requis.

PortPal — Developer Port Manager

D'habitude, c'est là que la routine commence. Vous ouvrez le terminal, vous vous souvenez de la syntaxe lsof -i :3000 sur macOS ou de grep netstat -ano sur Windows, vous copiez le PID, et vous tapez kill -9. Si vous avez une douzaine de microservices, le terminal se transforme en un charnier de commandes répétitives.

Le projet PortPal résout ce petit problème persistant. C'est un tableau de bord de bureau léger qui affiche les ports occupés, identifie la pile technologique et tue les processus redondants en un seul bouton.

Ce qu'il y a sous le capot et pourquoi vous en avez besoin

La plupart des utilitaires similaires sont soit des wrappers primitifs autour de commandes système, soit traînent un Electron lourd, consommant un gigaoctet de RAM juste pour afficher une liste de cinq lignes.

Les créateurs de PortPal ont pris une route plus agréable et ont construit l'application sur Tauri 2, Rust et React 19. Grâce à Rust, le backend charge à peine le CPU en arrière-plan, et la fenêtre native s'ouvre instantanément.

L'outil résout plusieurs tâches quotidiennes :

  • Trouve les ports locaux suspendus et extrait les métadonnées des processus.
  • Reconnaît l'environnement en fonction du contexte des fichiers et des ports par défaut.
  • Aide à arrêter de force un processus ou à le redémarrer.
  • Visualise les connexions réseau entre les services sous forme de graphe.

Fonctionnalités principales

Reconnaissance de projet au lieu de chiffres secs

Un moniteur système régulier ne vous indiquera que le PID et le nom binaire (par exemple, node ou python). Si cinq projets Node.js différents s'exécutent, les distinguer par la sortie du terminal est impossible.

PortPal fonctionne de manière plus intelligente. Il ne se contente pas de regarder le numéro de socket mais analyse également les répertoires de travail. Le programme recherche les fichiers manifestes (package.json, Cargo.toml, go.mod) et fait correspondre le numéro de port avec les environnements de développement populaires :

3000  -> React / Next.js
5173  -> Vite
4200  -> Angular
8000  -> Django
5432  -> PostgreSQL
6379  -> Redis

En résultat, le panneau affiche des cartes claires : vous pouvez immédiatement voir que votre frontend s'exécute sur le port 5173 et que la base de données écoute sur le 5432.

Carte interactive des connexions

Le détail le plus curieux de l'interface est la carte topologique construite avec la bibliothèque D3.js.

Port Map — Interactive Network Topology

Au lieu d'un tableau plat, vous obtenez une simulation physique avec des nœuds. Les nœuds sont colorés selon leurs technologies : bleu pour les bases de données, violet pour les bundlers Vite, vert pour le backend Node.js. Les nœuds peuvent être déplacés sur l'écran, zoomés avec la molette de la souris, et les liens réseau actifs peuvent être examinés en temps réel. Si vous développez un système avec plusieurs microservices, un tel graphe aide à comprendre rapidement qui maintient actuellement une connexion avec qui.

Gestion en un clic et bouton d'urgence

Chaque processus a un bouton de terminaison à côté de lui. Cliquez sur la croix — le processus se termine instantanément, le socket est libéré.

Si un port est occupé par un script planté que PortPal a mémorisé, un bouton de redémarrage reste à proximité. Il exécute à nouveau la commande dans un terminal séparé.

Dans l'interface, les ports sont divisés en deux groupes : les processus de développement et les services système. Tuer accidentellement un service système est plus difficile. Et pour les cas où vous avez terminé votre journée de travail et voulez fermer tout le zoo de serveurs locaux en cours d'exécution à la fois, il y a un bouton Kill All pour le groupe des frameworks de développement.

Fonctionnement en arrière-plan et barre d'état système

PortPal se minimise dans la zone de notification. L'icône de la barre change de couleur en fonction de la présence de conflits de ports. Pendant que la fenêtre est fermée, un thread en arrière-plan enregistre les événements : quand un nouveau processus est apparu, quel socket a été libéré, et où une pointe de trafic s'est produite. L'historique avec tous les horodatages est stocké dans un onglet logs séparé.

Architecture et pile technologique

La pile technologique du projet semble moderne :

Backend:      Rust (sysinfo + системные API сетевого стека)
Runtime:      Tauri 2
Frontend:     React 19 + TypeScript + Vite 7
Графика:      D3.js v7 (симуляция графов на силах)
Стили:        Vanilla CSS со стеклянными эффектами

En abandonnant les bibliothèques de composants frontend lourdes et en utilisant Webview natif, l'application est légère et consomme un minimum de ressources lors de l'analyse constante des sockets.

Comment lancer

Les développeurs publient des builds prêts à l'emploi sur la page des versions du dépôt :

  • Pour Windows, .msi et .exe sont disponibles.
  • Pour macOS, des builds .dmg sont préparés pour les puces Apple Silicon et les processeurs Intel.
  • Pour Linux, il y a des paquets .deb et le format universel .AppImage.

Si vous voulez construire l'utilitaire depuis le code source ou ajouter vos propres règles de détection, vous aurez besoin de Rust version 1.70 ou supérieure et Node.js 18+ :

# Клонируем репозиторий
git clone https://github.com/wisher567/Portpal.git
cd portpal

# Ставим зависимости и запускаем в dev-режиме
npm install
npm run tauri dev

En mode dev, le rechargement à chaud des composants React via Vite fonctionne en parallèle avec la compilation de la partie Rust.

Impressions personnelles

Le projet est jeune, actuellement en version 0.2, mais il ressemble déjà à un outil quotidien prêt à l'emploi. Le tableau de ports de base et les cartes fonctionnent rapidement. La carte D3.js semble initialement décorative, mais lors du débogage simultané d'une passerelle API, d'une base de données et de quelques clients, elle s'avère véritablement utile.

Les inconvénients mineurs incluent la base de données limitée pour la reconnaissance automatique des frameworks. Si vous exécutez un service personnalisé sur un port non standard comme 9211, PortPal l'affichera comme un processus régulier jusqu'à ce que vous liiez manuellement le contexte. Mais puisque le projet est open source sous licence MIT, ajouter à la liste des signatures dans le code est simple.

Qui trouvera cela utile : les développeurs web, les ingénieurs full-stack, et tous ceux qui jonglent régulièrement avec une douzaine de microservices locaux et qui sont fatigués de mémoriser les commandes de nettoyage des sockets.

Projets similaires