标签：#Web

Announcing Limn Engine I'm excited to launch Limn Engine — a lightweight, zero-dependency HTML5 Canvas game framework for the browser. No npm install. No build step. No bloated dependency tree. Drop in a single script and start making 2D games. The Core Idea: Display + Component Limn Engine is built around two classes that cover 90% of what you need in a 2D game: Display — The Game Shell A singleton Display class that manages the canvas, runs the game loop, handles keyboard and mouse input, controls the camera, and manages scenes. Setting up a game is a one-liner: const display = new Display (); display . start ( 800 , 600 ); Let me try creating it step by step . Component — Every Object in Your Game A unified Component class that combines position, size, color/image, velocity, physics, and collision detection. No separate "Sprite" and "Body" classes — one object does it all. const player = new Component ( 40 , 40 , " blue " , 100 , 100 ); Components support three modes: Rectangle — solid color shapes for rapid prototyping Image — loaded from spritesheets or single image files Text — the Tctxt subclass for text elements with backgrounds, padding, and alignment Key Features Dual-Canvas High-Performance Rendering Call display.perform() to activate dual-canvas mode. Static backgrounds and tilemaps are drawn once to an offscreen buffer, then composited as a single drawImage() call per frame. This dramatically reduces draw calls and improves frame rates for complex scenes. display . perform (); display . start ( 800 , 600 ); Tilemap Levels Define game worlds as 2D arrays and initialize the tilemap engine with one call. Supports dynamic tile placement during gameplay — great for destructible environments and breakable blocks. display . map = [ [ 1 , 1 , 1 , 1 , 1 ], [ 1 , 0 , 0 , 0 , 1 ], [ 1 , 0 , 9 , 0 , 1 ], [ 1 , 0 , 0 , 0 , 1 ], [ 1 , 1 , 1 , 1 , 1 ] ]; display . tileMap (); Sprite & AnimatedSprite Load horizontal spritesheets and define named animation clips (idle,

Last Sunday I shared nestjs-docfy, a small library to move Swagger decorators out of NestJS controllers into companion *.controller.docs.ts files. The reception was better than I expected, and a lot of the feedback pointed in the same direction: the separation is nice, but writing those docs files by hand is still tedious. So I spent some time on that, and there's quite a bit new in this release. A CLI that writes the boilerplate for you The biggest addition is a generate command that reads your project with static analysis (no code execution, no ts-node overhead) and produces a pre-filled docs file for every controller: npx nestjs-docfy generate The generated file comes with inferred summaries, response types, and common error responses already in place. You edit from there instead of starting from scratch. It's idempotent by default, running it again won't touch files that already exist. When you add a new endpoint and want to merge only the new method block without losing your existing edits: npx nestjs-docfy generate --force The CLI auto-detects your project layout, so monorepos (Nx, Nest CLI, generic packages/ or apps/ structures) work without any configuration. There's also a --dry-run flag if you want to preview output before writing anything to disk. A check command for CI The other side of the workflow is keeping docs in sync as the codebase evolves. The check command exits with code 1 if any controller has undocumented methods or no companion file at all: npx nestjs-docfy check Output looks like this when something is out of sync: ✖ UsersController, undocumented methods: updateProfile, deleteAccount → run nestjs-docfy generate --force to merge new methods ✖ 2 controller(s) out of sync. Drop it into your pipeline and docs drift gets caught before it reaches main. Type-safe method keys The docs() function now enforces that every key in config.methods actually exists on the controller class. Typos are a compile error, not a silent runtime warning: docs ( User

Hi what are the checks we need to do after making a website idk what type of checks are there i made a website using claude and lovable used free version of both for backend i used supabase now i want to check if my website is all good so that i can add it in my portfolio i am a btech 1st year student have a very basic level of coding submitted by /u/Shivansh_Yadav07 [link] [留言]

Disclaimer: yeah, I work in AI visibility, so I'm definitely biased on this. But what I want to get into actually cuts against what my own industry sells, so I figure it has a place here. Back in mid-May Google put out its first real guide on how to show up in AI answers (AI Overviews, AI Mode). I saw a bunch of write-ups on it and it was always the same song, structure your headings, add Schema, the usual blah. Except there's a "mythbusting" section in the doc I haven't seen anyone pick up on, and it's the most interesting part. Google says in plain terms that the famous llms.txt file does nothing, that you should stop obsessing over Schema.org, and that chunking is smoke and mirrors. Made me smile a bit since that's basically the package some "GEO" agencies are charging for right now. What they push instead is honestly kind of obvious. They talk about "commodity" vs "non-commodity" content. Like, if an AI can write your article on its own, it'll never cite you, makes sense, it already has the answer, why would it go looking for you. What gets cited is content with something the model doesn't have. A number you actually measured, a test you really ran, lived experience basically. The example that stuck with me (not in Google's guide, somewhere else) is a small blog specialized in robot vacuums, garbage domain authority, and it outranks the New York Times in AI answers. The NYT has a domain like 3x stronger. Except the NYT puts out an affiliate listicle anyone could copy, and the blog guy films his actual tests with real measurements. Guess who gets cited. And this is where it gets useful for you I think. It means for the most part you need neither a tool nor an agency. Take your most generic page, just ask yourself "could anyone write exactly this", and if the answer is yes, add something only you know. You don't even need data. A simple "the first question every client asks me is this" and you're already standing out. It's free and it weighs more than all the tech

I set up a Claude CLI instance on a Google Cloud VM Instance, cloned all my project repos (we run a dev agency), and wired up webhooks to Linear. When a ticket gets tagged, the CLI automatically reviews the relevant repo, understands what needs to be done, and drops a detailed technical breakdown right into the ticket. It's cut ticket completion time because devs now have way more context to feed into Claude Code or Cursor and just start building. Next step: I'm trying to get Claude to actually create working PRs based on that evaluation and knock out the whole ticket end-to-end. Still figuring out if the loop can fully close. Has anyone worked on a system like this? Would love to hear your approach. submitted by /u/theTbling [link] [留言]

What are the minimum requirements to have as a beginner web developer to be able to efficently learn and work online? like should you code in a private room? what kinds of desks are appropriate and what are not? how important is the calm atmosphere inside the house and outside? I know there is something called ergonomics and I want to ask programmers who have experience with learning and working from home and coding for long hours at home, if we categorize the working environments in 3 types: inapropriate, acceptable, good. What things should be in each category? Please share your experiences with any work environments you have/had. Thanks. submitted by /u/DurianLongjumping329 [link] [留言]

For years, whenever I needed to merge two PDFs or compress a file to upload to a government portal, I would Google "compress PDF", click the first result, and inevitably hit a paywall. "You have reached your 2 free files per day limit." Worse, I was uploading sensitive documents—tax returns, medical records, and NDAs—to random servers in God-knows-where just to strip out some heavy images. I decided to build an alternative. I wanted it to be 100% free, have absolutely no daily limits, and most importantly: zero server uploads . Here is how we built PDF Pro using Next.js and WebAssembly to process PDFs entirely natively inside the user's browser. The Architecture: Why WebAssembly? Traditional PDF tools (like Smallpdf or iLovePDF) use a monolithic server architecture. You upload your file to their AWS bucket, their backend runs a Python or C++ script (usually using Ghostscript or a proprietary library) to manipulate the PDF, and then you download the processed file. This architecture is expensive (high bandwidth and compute costs) and creates a massive privacy liability. By compiling a C++ PDF manipulation library down to WebAssembly (WASM) , we inverted the architecture. 1. The Build Process We took pdf-lib and custom C++ compression algorithms and compiled them to a lightweight .wasm binary. When a user visits PDF Pro Compress , their browser downloads the ~2MB WASM file once and caches it. 2. Client-Side Processing When you drag and drop a 50MB PDF into the UI, it never hits our server. Instead, the browser's JavaScript engine passes a Pointer to the file data directly into the WebAssembly memory buffer. The WASM module executes native C++ speeds directly on your local CPU to compress or merge the document. Performance Benchmarks Because there is zero upload and zero download time, the performance metrics are staggering: 10MB PDF Compression (Cloud): ~15 seconds (Upload) + 4 seconds (Process) + 5 seconds (Download) = 24 seconds . 10MB PDF Compression (PDF Pro WASM)

My CV is a PDF, and PDFs do not answer questions. So I built ask.hiten.dev : a streaming chat grounded in my actual career history, where a recruiter can ask "why should I hire you over another senior frontend engineer?" and get a real answer. The constraint that made it interesting: the total inference budget is zero. No OpenAI bill, no hosted vector DB, nothing. Here is what that actually took. Four free providers and a failover chain No single free tier is reliable enough to put in front of strangers. Groq's free tier caps at 100k tokens/day, and I hit that cap on day one. OpenRouter's free models come and go. Cerebras occasionally queues you out at busy times. The fix is boring and effective: an ordered provider chain, all OpenAI-compatible, walked per-request until one answers. Groq (llama-3.3-70b) -> OpenRouter (gpt-oss-120b:free) -> NVIDIA (llama-3.3-70b) -> Cerebras (gpt-oss-120b) Each provider is just a base URL, a key and a model name. The API route tries each in order; the first 2xx with a body wins, and the response streams straight through. The client gets an X-Provider header so I can see who served what in the logs. Two details that mattered: Empty env vars are not unset. Docker Compose's ${VAR:-} yields an empty string, which defeats ?? defaults in Node. Every key goes through a helper that coerces "" to undefined , otherwise a provider with no key "exists" and fails every request. You cannot cheaply probe a token-per-day cap. My health check hits GET /models on each provider (auth check, 60s cache). It tells you "key works, service up", not "you have tokens left". The failover chain covers the gap: a TPD-capped provider fails fast and the next one picks up. If every provider is down, the page itself says so. The health check runs server-side at render time, and instead of a broken chat you get a short maintenance note. Never ship a chat UI that can fail after the user has typed. Open-weight models do not follow formatting orders My site's voice avoi

Let’s all assume we’re able to do whatever is possible with CSS/HTML/JS. (No typescript or node.js due to hosting restrictions) How can one use it for their animation/storyboard portfolio, unlike making something like a wall of displayed art, how can it be made interactive in a professional way? I’m more interested in ideas that use the strength of web itself, not just decorative effects submitted by /u/Enc7 [link] [留言]

Cindy Zhang discusses the evolution of XDS, a unified UI system powering 10,000+ internal tools. She shares actionable insights for architects and engineering leaders on managing large-scale community contributions, executing safe monorepo refactors using JS AST and AI codemods, mitigating breaking changes via feature flags, and expanding UI libraries into full-stack platform systems. By Cindy Zhang

submitted by /u/Impressive_Layer_867 [link] [留言]

submitted by /u/techie_e [link] [留言]

I'm working on a free SVG icon project called IconShelf and recently noticed something confusing. Analytics show decent traffic, but signups and conversions are much lower than expected. To investigate, I started reviewing sessions in Microsoft Clarity and found behaviour that makes me suspect that a significant portion of visits may be from bots, crawlers, or automated traffic. I'm already using Cloudflare Bot Management and several WAF rules. I'm curious how other developers handle this. What tools do you use to identify bot traffic? Do you rely on analytics, server logs, Clarity, or something else? How do you measure "real" traffic versus raw pageviews? Have you ever discovered that your actual human traffic was much lower than your analytics suggested? I'd love to hear what worked for you and any lessons learned from tracking user behavior and conversions. What is the solution from developer prospective? Here in the screenshot 70% are bots? https://preview.redd.it/19jsil0e5m6h1.png?width=2604&format=png&auto=webp&s=70591a9e33c635cfbaacc64c9af1b5800b6e2e74 submitted by /u/Parking_Pea5161 [link] [留言]

Background: I accidentally created a recursive loop with an AI agent that would have cost me $50+ in API calls before I noticed. Existing tools either cost money or only show you what already happened. So I built TokenFirefighter — a 100% free, local-only HTTP proxy. What it does: - Sits between your app and OpenAI/Anthropic on localhost:7272 - Tracks every API call cost in real time - Detects 4 types of runaway loops and blocks them - Has a terminal dashboard (no web UI needed) - Zero accounts, zero data collection, zero cost Install: npm install -g tokenfirefighter tokenfirefighter init tokenfirefighter start Then just set OPENAI_BASE_URL=http://localhost:7272/v1 in your .env. Would genuinely appreciate feedback from anyone who uses AI APIs regularly. GitHub: https://github.com/MohitBaghel24/tokenfirefighter submitted by /u/AdventurousMirror122 [link] [留言]

Title. I've looked and looked but found nothing. submitted by /u/yduow [link] [留言]

Breaks down package managers as different dependency models rather than "faster npm replacements". It compares npm, Yarn, pnpm, Bun, and Deno through reproducibility, compatibility, disk usage, and migration failure modes. submitted by /u/OtherwisePush6424 [link] [留言]

AI coding tools are changing how software gets built. Claude Code, Cursor, GitHub Copilot, Windsurf and other tools can generate code incredibly fast. For small tasks, they are already useful: write a component, explain a function, scaffold an endpoint, create a test, refactor a file. But after using AI in real projects, one thing becomes obvious: The problem is no longer code generation. The problem is engineering control. Most AI coding workflows still look like this: text idea -> prompt -> code -> fix -> prompt again -> more code -> lost context -> start over It feels fast at the beginning. Then the project grows. Requirements change. Architecture decisions disappear inside chat history. The AI forgets previous context. You start acting as product manager, architect, reviewer, QA, DevOps, and prompt engineer at the same time. That is not software engineering. That is vibe coding. ## Vibe coding works until it doesn't Direct AI coding is great when the task is isolated. Ask for a React component. Ask for a SQL query. Ask for a utility function. Ask for a unit test. No problem. But real software is not a collection of isolated snippets. Real software has: - business rules - architectural constraints - existing patterns - security concerns - database impact - deployment requirements - edge cases - regression risk - long-term maintenance When AI jumps directly from prompt to code, it often skips the thinking that should happen before implementation. The result may compile. But does it fit the architecture? Does it respect the domain? Does it create hidden technical debt? Does it solve the right problem? That is the gap we are trying to close with N45.AI. ## What is N45.AI? N45.AI is a framework that turns AI coding tools into a structured engineering workflow. It works with the tools developers already use, including Claude Code, Cursor, GitHub Copilot, and Windsurf. The idea is simple: Instead of treating AI as one generic assistant, N45.AI organizes the work like a

My daughter Emma is 11. She's been vibe coding lately, and honestly, she's pretty good at it. The...

Hey everyone, I am a frontend dev and design engineer with about 4.5 years of experience. I am currently looking for a full time role. I am hoping to join an agency or a product team that actually cares a lot about good design. I love building modern and clean websites with a minimalist touch. My approach to work is just based on first principles. I always try to think about how Apple would make things. Good design is not really about what you add, it is about what you refine. Here is what I use to build things: My stack: React, Next.js, TypeScript, and Tailwind CSS. Animations: Motion and GSAP for really smooth interactions. How I work: I focus heavily on the design intent and the core architecture to build pixel perfect layouts and animations from scratch. You can check out my work here: My Portfolio: https://deepbuilds.in Recent Build (Autumn): https://autumndev.vercel.app If your team is looking for someone who sweats the small details and wants to build some really cool stuff together, drop me a DM. Let's talk! submitted by /u/Party-Membership-597 [link] [留言]

Keeping validation schemas, OpenAPI docs, and test fixtures in sync requires manual effort. I built TriadJS as a POC to consolidate them in one place. You define the API once using a TypeScript DSL. The framework derives the following: Runtime validation OpenAPI 3.1 & AsyncAPI specs Database schemas via Drizzle Boundary tests (calling scenario.auto() reads schema constraints to generate fuzz tests) This is a pre-1.0 project with specific architectural compromises: Auto-generated tests abstract away edge cases, which can complicate debugging. Designed for AI: It optimizes for single-file context so LLMs can read the API without traversing multiple YAML and test files. This prioritizes scaffolding over standard modularity. There is are built in claude plugin with skills (schema DSL, endpoints, channels, BDD behaviors with the authoritative assertion phrase table, testing, adapters, Drizzle, CLI, DI) and 8 slash commands ( /triadjs:new , /triadjs:model , /triadjs:endpoint , /triadjs:channel , /triadjs:scenario , /triadjs:test , /triadjs:docs , /triadjs:validate ). I am looking for feedback on this architecture. Is this level of tight coupling an anti-pattern, or is the single source of truth worth the DSL requirement? Repo: TriadJS submitted by /u/justhamade [link] [留言]