标签：#Web

Almost every "generate a PDF" feature starts the same way. You already have HTML. You already have CSS. So you reach for the obvious move: render the page, screenshot it to PDF, ship it. Puppeteer, Playwright, wkhtmltopdf, a hosted "HTML to PDF API" — pick your flavor. In an afternoon you have an invoice coming out the other end and it looks fine. Then it goes to production. And "fine" slowly turns into a backlog of weird, hard-to-reproduce bugs. This is not an argument that HTML-to-PDF is useless. For a one-off export or an internal report, it's great. The argument is narrower: the moment PDF generation becomes a real, automated, customer-facing part of your product, "screenshot a web page" is the wrong abstraction — and the failure modes are predictable enough to list in advance. The core problem: a PDF is not a web page A browser renders for an infinite, scrollable, single-width viewport. A PDF is a stack of fixed, finite, printable pages. Those are different physics. HTML-to-PDF works by rendering your page in a headless browser and then slicing that continuous render into page-sized pieces. Everything that's hard about it comes from that one mismatch: you designed for a stream, and now you're forcing it into pages. Most of the bugs below are just that mismatch showing up in different costumes. Failure mode 1: pagination This is the big one. A browser has no concept of "page 2." So when your content is taller than one page, the engine has to guess where to cut — and it cuts wherever the pixel ruler lands. That means: a table row sliced in half across the page break a heading stranded alone at the bottom of a page, its content on the next a total row that floats away from the table it belongs to a signature block split from the line above it CSS has break-inside: avoid , break-before , and friends — and they help. But support is uneven across engines, they interact badly with flex/grid, and you end up hand-tuning rules per document until it looks right for the da

I spent 13 years in financial services — 7 at Discover Financial, 6 at Bread Financial — consistently finishing in the top 5% of my team. I was good at my job. Really good. But in March 2026, I enrolled in Coding Temple's Full-Stack Web Development bootcamp and started building. Here's what 3 months actually looks like from zero. Month 1: HTML, CSS, and Figuring Out Why Nothing Looks Right I started where everyone starts — HTML and CSS. Built a food landing page (FoodSpot) and a multi-page event site (EventHive). Learned Flexbox, Grid, responsive design, and why box-sizing: border-box should just be the default everywhere. What I shipped: FoodSpot — food landing page EventHive — responsive multi-page event site What I earned: ✅ Web Development with HTML & CSS (Coding Temple verified badge) Month 2: JavaScript, Then Python JavaScript clicked faster than I expected. DOM manipulation, ES6+, event listeners. Then Python — and honestly, Python felt natural. The OOP concepts made sense immediately. What I shipped: Python CLI Task Manager — persistent task app with file storage, OOP, exception handling Defeat the Evil Wizard — text-based RPG with multiple classes, inheritance, combat logic, and game state management What I earned: ✅ JavaScript Mastery ✅ Python Foundations for Software Engineering ✅ Advanced Python Month 3: React React was the biggest jump. Component architecture, hooks, state management, routing. But I got through it by building something real. What I shipped: FakeStore API — a full e-commerce SPA consuming a live REST API with dynamic product rendering, client-side routing, CRUD operations, and loading/error state management What I earned: ✅ Single Page Apps with React What I Brought From Finance That Helped People underestimate what non-tech backgrounds bring to code. Here's what transferred directly: Data analysis → Debugging mindset. I spent years finding patterns in account data. Finding why code breaks is the same muscle. Process optimization → Clean

We tend to write React as functional programming because the functional component is the mainstream. In this era, one of the issues we often encounter is conditional statements. There are a variety of conditional statements, such as if, switch, and ternary operator. We confuse when to use them properly. Assign the result of the conditional statement into a variable This makes it easy to read, test, and modify codebases. The representative case is ternary operator const userName = user ? user . name : ' No user found ' ; Of course, we can write the code another way. const point = 80 ; let result ; if ( point >= 70 ) { result = ' passed ' ; } else { result = ' failed ' ; } console . log ( result ); // passed In this way, we can not ensure the immutability of let , and this section with the conditional branch is written in a procedural style. To solve this issue, we have to wrap this in a function. const judge = ( point : number ) => { if ( point >= 70 ) { return ' passed ' ; } return ' failed ' ; }; In addition to wrapping that statement, I suggest that you use early return to save the else statement. Do not write conditional statements in the return value of tsx (the UI rendering portion) ** When there is only a single conditional statement, or there is no need for any execution in the conditional statement. Let's use the ternary operation simply. import { FC } from ' react ' ; import { useQuery } from ' @tanstack/react-query ' ; import getUser from ' domains/getUser ' ; type Props = { userId : number ; }; const Profile : FC < Props > = ( props ) => { const { userId } = props ; const getSpecificUser = async () => { const specificUser = await getUser ( userId ); return specificUser ; }; const { data : user } = useQuery ([ ' user ' , userId ], getSpecificUser ); const userName = user ? user . name : ' User not found ' ; return < p > User ： { userName } < /p> ; }; export default Profile ; const userName = user ? user . name : ' User not found ' ; In this statement, you

An innovative Moroccan platform for finding, renting, and selling real estate, offering a simple and seamless experience tailored to the local market. Challenge Launch Sarout.ma, an innovative Moroccan platform dedicated to searching, renting and selling real estate, on an ultra-competitive market dominated by a few historical players often criticized for dated ergonomics and uneven listing quality. The challenge: build an intuitive, modern real estate marketplace able to connect individual owners, agencies and tenants across all of Morocco — Casablanca, Rabat, Marrakech, Tangier, Agadir — with clear navigation and smart search. It also required enriched, geolocated listings updated in real time, and a journey differentiated by user profile (searcher, owner, professional agency). Solution Development of a site with a clean, fully responsive interface, designed mobile-first since most real estate searches in Morocco happen on smartphones. Integration of advanced dynamic filters (city, neighborhood, price, surface, number of rooms, property type, furnished/unfurnished) with instant result refresh. Listing management via a complete owner dashboard: creation, editing, view statistics, photo management with multi-upload and automatic compression, scheduling of paid promotions. Each property page has an SEO-optimized URL, rich descriptive content, precise geolocation on an interactive map, and the option to directly request a viewing. SEO architecture focused on local ranking: category pages per city and neighborhood, Schema.org RealEstateListing markup, dynamic sitemap. Email alert system for saved searches, listing moderation, and a professional agency dashboard for premium accounts. Results A high-performing, accessible real estate portal that significantly simplifies property search for individuals and strengthens listing visibility across Morocco. The interface fluidity stands out in a market where competition remains rough around the edges. Steady growth in publishe

The code runs. That's not the question. There's a failure mode with AI-generated code...

After months of building in public, is live on Product Hunt today! 🎉 The problem Every dev team I've worked with ends up in the same trap: Jira is too heavy and slows everyone down with ceremony, while Trello/Notion are too light and can't actually tell you if your sprint is on track. Nobody had a tool that combined real project management with AI that actually understands developer workflows. So I built one. What is Rahnuma.io? Rahnuma.io is an AI-powered DevOps platform that sits where project management meets your actual engineering workflow: 🧠 AI task generation — describe a feature in plain English, get a structured task with subtasks 📊 Deadline risk forecasting — a live risk score (0–100) built from time risk, blockers, and completion rate, so you know a sprint is in trouble before it blows up 🗂️ Kanban + sprints — drag-and-drop boards, WIP limits, burndown charts, story points 🤖 AI sprint retros — auto-generated "what went well / what didn't / action items" 🔗 GitHub & Bitbucket integration — see commits next to the tasks they belong to 📈 Reports that don't require a translator — including an "Explain to My Boss" button that turns your sprint into a plain-English executive summary 🔔 Slack notifications for task creation, assignment, and comments 🧾 Client portals — shareable, printable progress reports for non-technical stakeholders Why it's different Most "AI project management" tools just bolt a chatbot onto a Trello clone. AI is wired directly into the data model — it knows your sprint history, your velocity, your blockers — so the forecasts and summaries are grounded in your actual project state, not a generic prompt. Tech under the hood Next.js 15 (Turbopack) · TypeScript · Prisma + PostgreSQL · Clerk auth · Polar billing · Redis · xAI Grok with Groq fallback for AI · Server-Sent Events for realtime sync. Try it It's free to start, no credit card required. I'd love your feedback — especially from anyone who's felt the Jira-is-too-much / Trello-is-too-littl

The whole industry seems to have agreed on a standard for design tokens. The shift it sets up is still on its way. Design tokens are not new. The term was coined in 2014, at Salesforce, by Jina Anne and Jon Levine. 1 By 2017, Amazon had open-sourced Style Dictionary and the idea had spread well past Salesforce. We have been shipping design tokens for over a decade. What we never did, in all that time, was agree on a format. Every tool and every team rolled its own shape. There was never one neutral way to write a token down, its value and its meaning, so that any other tool could read it. Have you heard of DTCG? I hadn't, until recently. It is the Design Tokens Community Group, a W3C effort to finally settle that format. 2 The repo is quiet, but that is because the spec reached its first stable version in late 2025, not because anyone walked away. The quiet is a thing being finished, not abandoned. The list of who is backing it is not quiet at all. Adobe. Google. Microsoft. Meta. Amazon. Shopify. Salesforce. Sony. Pinterest. The New York Times. Disney. Framer. Penpot. Figma. Plus a dozen more. 2 That is not a side project. That is most of the industry quietly agreeing on something. One of those names, Figma , is the reason for the title of this piece. We will get to it, because the irony is the whole point. Here is my bet, and I will say up front that it is a bet. I think a storm is coming for design tooling. You do not have to believe me about the storm, because the bet does not depend on it. If you are wiring your tokens straight into one vendor's format, you are exposed. Anchor them to the open standard instead and you are not. The downside is lopsided. If I am wrong, you have lost almost nothing. If I am even half right, everyone hard-coded to a single tool is facing a rewrite. The format is young and already fragmenting. That is the point. The obvious objection is that the standard is too new to bet on, and already splintering. It is splintering. Google's DESIG

Creating Short Links with PHP: A Practical Guide URL shorteners are everywhere. They're used in marketing campaigns, email newsletters, QR codes, social media posts, affiliate links, and analytics platforms. While most developers are familiar with services like Bitly, integrating a URL shortener directly into your application is often much more useful. In this article, we'll build short links from PHP using an API. Why Create Short Links Programmatically? Creating links through a dashboard works for occasional usage. But applications often need to generate links automatically. Common examples include: Email campaigns User invitations Affiliate systems QR code generation Marketing automation Analytics tracking Customer portals An API allows applications to create and manage links without human interaction. The Traditional HTTP Approach Most URL shortener APIs work through simple HTTP requests. For example: $client = new GuzzleHttp\Client (); $response = $client -> post ( 'https://example.com/api/links' , [ 'headers' => [ 'X-Api-Key' => $apiKey , 'Content-Type' => 'application/json' , ], 'json' => [ 'url' => 'https://example.com/article' ] ] ); $data = json_decode ( $response -> getBody (), true ); echo $data [ 'short_url' ]; This works. But once your application creates dozens or hundreds of links, the amount of boilerplate code starts growing. Using a PHP SDK A PHP SDK removes most of the repetitive work. Installation is usually straightforward: composer require lix-url/php-sdk Creating a link becomes much simpler: $link = $client -> links () -> create ([ 'url' => 'https://example.com/article' ]); echo $link -> shortUrl ; The SDK handles: Authentication HTTP requests Response parsing Error handling DTO mapping This allows your application code to remain clean. Creating Your First Short Link Let's imagine an application that sends invitation emails. $inviteLink = $client -> links () -> create ([ 'url' => 'https://myapp.com/invite/abc123' ]); echo $inviteLink -> short

Code generation tools are powerful and can significantly accelerate development work. Their main limitation is not capability, but context. Without access to organizational knowledge, internal conventions, and system-specific patterns, generated output often requires careful verification. This is why generation tools work best when paired with AI code search, as the latter provides immediate visibility into the existing codebase, making it easier to align AI-generated changes with the realities of the system. In regulated environments, the adoption model may look different. Security or compliance constraints can restrict the use of cloud-based code generation. AI code search still improves developer efficiency across implementation, review, and documentation workflows by enabling fast navigation and comprehension of large multi-repository codebases. What is AI code intelligence, and how does it help in practice? Code intelligence tools help developers find and understand existing code. If a search returns a poor result, the developer simply searches again. Nothing changes in your codebase. Code search also integrates without friction. No new review processes, no changes to CI/CD, no new permissions. Generation tools require policies for AI-written code that stall many pilots before they produce data. Clear metrics for measuring AI code intelligence An AI code search assistant only reads your code, which makes it much easier to measure its impact. You can track simple things like: • how long it takes to find the right piece of code • how quickly new developers get up to speed • how many hours the team spends searching each week If your team of 20 developers each spends 5 hours weekly understanding code, that equals 100 hours of engineering time. At $75 per hour, that’s $360,000 per year. Assume 10% reduction recovers $36,000, a realistic input for an AI ROI framework for tech teams. Faster path to Phase 3 expansion Code generation tools face tough questions from secu

For three months, I weighed myself every morning and took body measurements every Sunday. I used a caliper, a tape measure, and a scale that probably lies to me about hydration levels. The goal wasn't to get ripped. It was to understand whether any of these measurements actually mean something day to day. The Problem With Most Health Calculators Most body fat calculators fall into one of two camps: Too simple — plug in height and weight, get a BMI number that tells you nothing about your actual composition. Too complicated — requires measurements you need a degree to take correctly, plus an email signup and a paid subscription. Neither is useful for someone who just wants to know "am I making progress?" Building Something Practical I put together a calculator that uses the Navy Method — it takes neck, waist, and hip measurements and estimates body fat percentage. The math has been around since the 80s and correlates reasonably well with DEXA scans for most people: function navyBodyFat ( gender , neck , waist , hip , height ) { if ( gender === ' male ' ) { return 86.010 * Math . log10 ( waist - neck ) - 70.041 * Math . log10 ( height ) + 36.76 } return 163.205 * Math . log10 ( waist + hip - neck ) - 97.684 * Math . log10 ( height ) - 78.387 } The inputs are simple enough that anyone can take them with a tape measure. The output gives you a ballpark number that's consistent enough to track trends over time. What 90 Days of Data Taught Me Three things stood out: Daily weight is useless; weekly trend is everything. My weight would swing 2-3 pounds daily due to water, food, and sleep. The weekly moving average was the only signal worth watching. Body fat percentage changes slowly. Like, frustratingly slowly. In 90 days of consistent training, I moved maybe 2%. But that's real — if a calculator tells you you dropped 5% body fat in a month, it's broken. Consistency beats precision. Taking measurements at the same time, under the same conditions, with the same method matter

For a decade, "what's your frontend stack?" was a loaded question. jQuery vs. Backbone. Angular vs. React. Webpack vs. everything. The churn was exhausting, and a non-trivial chunk of our job was just keeping up. That era is quietly ending — not because we won the framework wars, but because the questions moved up a layer. The interesting problems in frontend today aren't about which library renders a list. They're about how rendering, data, and increasingly generation fit together. And AI is sitting right in the middle of that shift. The stack consolidated more than we admit Look at what most new production apps actually reach for in 2026: React or Svelte/Vue for the component model, with the framework wars settling into "pick one, they're all fine." A meta-framework — Next, Remix/React Router, SvelteKit, Nuxt — because nobody hand-rolls routing, data loading, and SSR anymore. TypeScript by default. Not a debate. The plain-JS greenfield project is now the exception. Server-first rendering (RSC, islands, streaming) as the baseline, with the client bundle treated as a cost to minimize rather than the center of the universe. The center of gravity moved back toward the server — but a smarter server that streams HTML, hydrates selectively, and treats the network boundary as a first-class design concern. The pendulum didn't swing back to 2010; it spiraled forward. What AI actually changed (and what it didn't) The hype says "AI writes the frontend now." The reality on the ground is more specific and more interesting. It collapsed the cost of the first 80%. Scaffolding a component, wiring a form, translating a Figma frame into JSX, writing the Tailwind for a layout — these used to be hours of work and are now minutes. That's real, and it's already changed how teams estimate. It did not collapse the last 20%. Accessibility edge cases, focus management, race conditions in async state, the weird Safari bug, the design-system invariant that isn't written down anywhere — this i

Splitting a PDF is one of those features that sounds trivial until you try to build it. Users expect range input ( 1-3, 5, 7-9 ), a per-page option, multiple file downloads, and zero server involvement. I built en.sotool.top/split/ to do exactly that. Here's how it works with Vue 3 and pdf-lib . Why Client-Side? PDFs often contain sensitive information. Contracts, medical records, financial statements. Even a "simple" splitting tool should not force users to upload files to a server. Client-side benefits: No upload bandwidth or size limits No server storage or cleanup Instant processing for normal files Works offline after the page loads The tradeoff is that everything has to run in the browser, which limits the libraries you can use. The Stack Vue 3 — UI and state pdf-lib — Load, manipulate, and save PDFs File API — Read the uploaded file lucide-vue-next — Icons npm install pdf-lib Loading the PDF and Counting Pages First, read the file into an ArrayBuffer and load it with pdf-lib . import { PDFDocument } from ' pdf-lib ' const pdfFile = ref < File | null > ( null ) const totalPages = ref ( 0 ) async function handleFile ( files : File []) { if ( files . length === 0 ) return pdfFile . value = files [ 0 ] const bytes = await files [ 0 ]. arrayBuffer () const pdf = await PDFDocument . load ( bytes ) totalPages . value = pdf . getPageCount () } Now we know how many pages exist and can show the split UI. Two Split Modes I offer two ways to split: by range and per page. Mode 1: Page Range Input Users type something like 1-3, 5, 7-9 . I parse it into groups of page indices. function parseRanges ( input : string , max : number ): number [][] { const groups : number [][] = [] const parts = input . split ( ' , ' ). map ( s => s . trim ()) for ( const part of parts ) { if ( part . includes ( ' - ' )) { const [ start , end ] = part . split ( ' - ' ). map ( Number ) const pages = [] for ( let i = start ; i <= end && i <= max ; i ++ ) { pages . push ( i - 1 ) } if ( pages . len

Prologue A while ago, I decided to develop a fully accessible main navigation component in React and write a series of articles documenting the steps it took to create a non-trivial accessible component. In my last development article , I finally completed the requirements for delivering an uncontrolled navigation component with a horizontal layout; with full keyboard functionality, along with adding the niceties of closing sublists when lists are closed and making sure any open sublist on the top row closes when focus shifts away from it. Rather than write an entirely new component for a mobile version, I'm going to modify the existing code. This first article outlines the steps necessary to set up and work with a controlled component. -— Note : This article is one of a series demonstrating building a React navigational component from scratch while considering accessibility through the process. The articles are accompanied by a GitHub repository with releases tied to one or more articles; each builds on the previous one until a fully implemented navigation component is complete. Each release and its associated tag contain fully runnable code for the article. The code discussed in this article is available in the release. and may be downloaded at release 1.0.0 . Links in the article will take you to the proper file in the tagged GitHub Repository. Because the code for this release is scattered across components, line numbers are added to make it easier to locate in the linked GitHub file. Line numbers are also provided for those who would like to follow along with a downloaded copy. While code examples are written in JavaScript for brevity, all actual code is written in Typescript and targets React 19.x, all while using vanilla CSS. Examples use Next.js v16.x, which is not required to run the navigation component. You can view the requirements for the Controlled Components Release along with previous requirements. Content Links Introduction Acceptance Criteria Contr

Introduction I'm Ahmer. I'm 19, I'm doing a 4-year Software Engineering degree at a fairly...

kreuzcrawl began as a Rust core with bindings for ten languages. v0.3.0 ships fourteen, adds a tiered WAF-aware dispatch engine, cuts peak streaming memory from ~2.5 GB to ~20 MB, and enables SSRF defense across every outbound call path by default. It is the first release we consider API-stable. This post covers what changed, why each decision was made, and what the harder engineering problems looked like from the inside. At a glance Area v0.2.0 v0.3.0 Language bindings 10 14 (+Dart, Kotlin/Android, Swift, Zig) Peak streaming memory ~2.5 GB ~20 MB SSRF protection opt-in on by default Dispatch model static HTTP / bypass / browser tiered, signal-driven escalation WAF fingerprints — 35 across 8 vendors Fingerprint hot-reload — lock-free ( ArcSwap ), 500 ms debounce MCP tools partial 1:1 with CLI, safety-annotated CLI subcommands scrape, crawl + batch-scrape, batch-crawl, download, citations Robots / sitemap parsers engine-internal public modules API stability preview stable Four new language bindings v0.2.0 shipped Rust, Python, Node.js, Ruby, Go, Java, C#, PHP, Elixir, and WebAssembly. v0.3.0 adds Dart , Kotlin/Android , Swift , and Zig — bringing the total to fourteen. None of the per-language glue is written by hand. Every binding is generated from the Rust core by alef , our polyglot binding generator. The Dart and Kotlin/Android packages bind through the C FFI layer ( kreuzcrawl-ffi ) via dart:ffi and JNI respectively. Swift binds through clang. Zig uses @cImport against the same C header. The generation pipeline also hardened in this release: the Docker publish matrix now builds each architecture natively rather than via QEMU emulation, the Dart build no longer requires the Flutter SDK for pub.dev publishes, Swift artifactbundle checksums are injected automatically, and the Elixir/PHP/Ruby releases preserve their lock files through the source-publish step. === "Python" ```sh pip install kreuzcrawl ``` === "Node.js" ```sh npm install @xberg/kreuzcrawl ``` === "Rus

Last year I was doing a code review for a startup. Everything looked fine on the surface, clean code, good structure, tests passing. Then I noticed this: const query = `SELECT * FROM users WHERE email = ' ${ req . body . email } '` That's it. That's the bug. SQL injection, sitting right there in a startup that had been in production for 8 months. Nobody caught it. Not the developer, not the reviewer, not the CTO. Here's the thing, it's not that developers are careless. It's that this kind of bug is invisible until it isn't. The code works perfectly. Tests pass. Users are happy. Until someone types ' OR '1'='1 in the email field and walks straight into your database. The bugs I see most often 1. Raw SQL with user input // 🚨 This is everywhere const query = `SELECT * FROM users WHERE email = ' ${ email } '` // ✅ Use parameterized queries const query = ' SELECT * FROM users WHERE email = $1 ' db . query ( query , [ email ]) 2. Secrets in environment variables... committed to git # .env DATABASE_URL = postgres://user:actualpassword@prod-db.company.com/mydb STRIPE_SECRET = sk_live_... Then .env ends up in the repo because someone forgot to add it to .gitignore . I've seen this more times than I want to admit. GitHub's secret scanning catches some of these, but not always before someone has already cloned the repo. 3. JWT tokens that are never actually verified // 🚨 Decoding is not the same as verifying const user = jwt . decode ( token ) // ✅ Always verify const user = jwt . verify ( token , process . env . JWT_SECRET ) jwt.decode just reads the token. Anyone can forge it. jwt.verify actually checks the signature. The names are confusingly similar and the wrong one silently works in development. 4. No rate limiting on auth endpoints // 🚨 Anyone can try a million passwords app . post ( ' /login ' , async ( req , res ) => { const user = await db . findUser ( req . body . email ) // ... }) // ✅ Add rate limiting const authLimiter = rateLimit ({ windowMs : 15 * 60 * 1000 , m

Hello, I'm Maneshwar. I'm building git-lrc, a Micro AI code reviewer that runs on every commit. It is...

Most people lose hours pretending to work or study. I was one of them. I kept setting Pomodoro timers and ending up scrolling Twitter during breaks. That's not rest. That's just a different kind of distraction. So I built Mognota — a free wellness companion for screen workers. The Problem You don't have a discipline problem. You have a system problem. Your brain has a hard biological limit. Sustained attention peaks at 20-45 minutes before quality drops sharply. Long unfocused hours are not work — they are the feeling of work. The solution isn't more willpower. It's intentional recovery. What I Built Mognota pairs a Pomodoro timer with 50+ guided wellness activities: 👁️ 20-20-20 eye break reminders 🫁 Guided breathing & 7 pranayama techniques 🧘 Desk yoga, HIIT, Tai Chi, stretches 🎵 Binaural beats & ambient soundscapes 🧠 Meditation & NSDR protocols 📓 Gratitude journal, mood tracker, brain dump 🎮 Sudoku, sliding puzzle, fractal explorer The Technical Part This is what dev.to might find interesting: Pure HTML, CSS, vanilla JS — zero frameworks Everything in a single HTML file All 8 notification sounds synthesized with Web Audio API localStorage only — nothing leaves your device Works offline once loaded 109+ languages supported No npm. No build step. No dependencies. Just open and use. Try It 👉 https://mognota.com/ Completely free. No account. No ads. Forever. Would love brutal honest feedback from this community.

Adding an AI feature looks deceptively easy. You sign up for an API key, paste in a prompt, and within an hour you've got a working demo that makes the whole team lean over your shoulder. Then you ship it, traffic arrives, and two things happen at once: your latency graph develops a long, ugly tail, and your monthly bill arrives with a number that makes finance schedule a meeting. The gap between "impressive demo" and "production feature" is almost entirely about cost and latency engineering. The model is the easy part. Here's how to cross that gap. First, understand what you're actually paying for Most LLM APIs bill by tokens — roughly ¾ of a word each — and they bill both directions: the tokens you send (input) and the tokens the model generates (output). Output tokens are usually several times more expensive than input tokens, which has a non-obvious consequence: a verbose prompt is cheaper than a verbose answer. This reframes optimization. People obsess over trimming their prompts while letting the model ramble for 800 tokens when 80 would do. If you want to cut cost, the highest-leverage move is almost always constraining the output : ask for JSON, ask for a single sentence, set a max_tokens ceiling, and tell the model explicitly to be terse. Latency follows the same logic. Generation is sequential — the model produces one token at a time — so output length is the single biggest driver of how long a request takes. A 50-token answer is fast almost regardless of model. A 2,000-token answer is slow even on the fastest infrastructure. Lever 1: Don't call the model when you don't have to The cheapest, fastest LLM call is the one you never make. Two techniques eliminate a startling share of traffic. Caching identical and near-identical requests. Many real-world prompts repeat — the same FAQ-style question, the same document summarized twice, the same classification of similar inputs. A cache keyed on the normalized prompt turns a repeat request into a sub-millisecond

If you've wired Swiss Ephemeris into a Node astrology app, you know the ritual. You npm install sweph , and now every machine needs Python plus a C/C++ toolchain, because the package compiles Swiss's C code via node-gyp at install time (make/gcc on Linux, Xcode on macOS, Visual C++ Build Tools on Windows). It works on your laptop. Then it explodes: Apple Silicon: node-gyp can't find full Xcode behind Command Line Tools. Slim Docker / CI images: no Python, no build-essential , so the install dies. Serverless: the .node binary you built locally won't load on Amazon Linux (wrong arch or glibc). Then there's the data. Neither sweph nor swisseph bundles the .se1 ephemeris files; you download them yourself and point the library at a path. The modern set is 2 MB, the full GitHub set is 100 MB. And since 2.10.1 , sweph is AGPL-3.0 (LGPL only under a professional license), a real obligation to weigh for a closed-source SaaS backend. The pure-Rust alternative XALEN Ephemeris is an analytical engine written entirely in Rust and licensed Apache-2.0. Three things make it interesting for JS/TS devs: No node-gyp. The Node addon is napi-rs, which ships prebuilt per-platform binaries via npm. No Python, no C compiler, no compile step. A real WASM build via wasm-bindgen, so you compute charts client-side in the browser: no server round-trip, no backend copyleft. Zero data files. The core math (VSOP87A, ELP2000-82, IAU precession/nutation, an 8,870-star catalog) is analytical and compiled into the binary. No .se1 to host. import init , * as xalen from " xalen-ephemeris " ; // WASM build, runs in the browser await init (); // load the .wasm module const chart = xalen . computeChart ({ datetime : " 1990-04-12T08:30:00Z " , lat : 28.6 , lon : 77.2 }); console . log ( chart ); // planet longitudes, house cusps, etc. Swiss via Node XALEN (pure Rust) Build deps node-gyp + Python + C compiler none: prebuilt binary / .wasm Runtime data .se1 files (2 to 100 MB) none, compiled in Browser / WASM