开发者
Learning about Truthy and Falsy Values in JavaScript
In JavaScript, truthy and falsy values are concepts related to boolean evaluation. Every value in JavaScript has an inherent boolean "truthiness" or "falsiness," which means they can be implicitly evaluated to true or false in boolean contexts, such as in conditional statements or logical operations. What Are Truthy Values? Truthy values are values that are evaluated to be true when used in a Boolean context. Simply put, any value that is not explicitly falsy is considered truthy. These are some truthy values Non-zero numbers: 42, -1, 3.14 Non-empty strings: "hello", "0", " " Objects and arrays: {}, [] Functions: function() {} Dates: new Date() Symbols: Symbol() BigInt values other than 0n: 10n if ( 42 ) console . log ( " This is truthy! " ); if ( " hello " ) console . log ( " Non-empty strings are truthy! " ); if ({}) console . log ( " Objects are truthy! " ); Output This is truthy ! Non - empty strings are truthy ! Objects are truthy ! What Are Falsy Values? Falsy values are values that evaluate to false when used in a Boolean. JavaScript has a fixed list of falsy values false 0 (and -0) 0n (BigInt zero) "" (empty string) null undefined NaN document.all (used for backward compatibility) if (0) console.log("This won't run because 0 is falsy."); if ("") console.log("This won't run because an empty string is falsy."); if (null) console.log("This won't run because null is falsy."); Truthy vs. Falsy Evaluation in JavaScript Whenever JavaScript evaluates an expression in a Boolean (e.g., in an if statement, a logical operator, or a loop condition), it implicitly converts the value into true or false based on whether it is truthy or falsy. With if Statement let s = " JavaScript " ; if ( s ) { console . log ( " Truthy! " ); } else { console . log ( " Falsy! " ); } Output Truthy ! Logical Operators with Truthy and Falsy Logical operators like && (AND) and || (OR) work with truthy and falsy values && (AND): Returns the first falsy operand or the last operand if all are tr
开发者
Conditional Statements in JavaScript
JAVASCRIPT CONDITIONAL STATEMENTS JavaScript conditional statements are used to make decisions in a program based on given conditions. They control the flow of execution by running different code blocks depending on whether a condition is true or false. Conditions are evaluated using comparison and logical operators. They help in building dynamic and interactive applications by responding to different inputs. Types of Conditional Statements 1. if Statement The if statement checks a condition written inside parentheses. If the condition evaluates to true, the code inside {} is executed; otherwise, it is skipped. Executes code only when a specified condition is true. Useful for making simple decisions in a program. Syntax : if ( condition ) { // code runs if condition is true } let x = 20 ; if ( x % 2 === 0 ) { console . log ( " Even " ); } if ( x % 2 !== 0 ) { console . log ( " Odd " ); }; Output Even 2. if-else Statement The if-else statement executes one block of code if a condition is true and another block if it is false. It ensures that exactly one of the two code blocks runs. Used when there are two possible outcomes. The else block runs when the if condition is not satisfied. let age = 25 ; if ( age >= 18 ) { console . log ( " Adult " ) } else { console . log ( " Not an Adult " ) }; Output Adult 3. else if Statement The else if statement is used to test multiple conditions in sequence. It executes the first block whose condition evaluates to true. Allows checking more than two conditions. Evaluated from top to bottom until a true condition is found. const x = 0 ; if ( x > 0 ) { console . log ( " Positive. " ); } else if ( x < 0 ) { console . log ( " Negative. " ); } else { console . log ( " Zero. " ); }; Output Zero . 4. Using Switch Statement (JavaScript Switch Case) The switch statement evaluates an expression and executes the matching case block based on its value. It provides a clean and readable way to handle multiple conditions for a single varia
开源项目
🔥 y13sint / FreeQwenApi - Локальный API-прокси для Qwen AI с поддержкой сохранения кон
GitHub热门项目 | Локальный API-прокси для Qwen AI с поддержкой сохранения контекста диалогов и управления сессиями через REST API | Stars: 207 | 13 stars today | 语言: JavaScript
开源项目
🔥 fastify / fastify - Fast and low overhead web framework, for Node.js
GitHub热门项目 | Fast and low overhead web framework, for Node.js | Stars: 36,440 | 23 stars today | 语言: JavaScript
开源项目
🔥 hmjz100 / LinkSwift - 一个基于 JavaScript 的网盘文件下载地址获取工具。基于【网盘直链下载助手】修改 ,支持 百度网盘 / 阿里云盘
GitHub热门项目 | 一个基于 JavaScript 的网盘文件下载地址获取工具。基于【网盘直链下载助手】修改 ,支持 百度网盘 / 阿里云盘 / 中国移动云盘 / 天翼云盘 / 迅雷云盘 / 夸克网盘 / UC网盘 / 123云盘 八大网盘 | Stars: 15,746 | 84 stars today | 语言: JavaScript
开源项目
🔥 tradesdontlie / tradingview-mcp - AI-assisted TradingView chart analysis — connect Claude Code
GitHub热门项目 | AI-assisted TradingView chart analysis — connect Claude Code to your TradingView Desktop for personal workflow automation | Stars: 3,470 | 31 stars today | 语言: JavaScript
AI 资讯
Game Jams no Browser: Você Não Precisa de Unity
Se você já fez algum front-end interativo, já tem 80% do que precisa pra fazer um jogo simples. Game jams como a June Solstice são desculpa perfeita pra testar isso — três semanas, tema aberto, e você descobre que canvas + requestAnimationFrame levam longe. Por Que Desenvolvedores Web Deviam Fazer Game Jams A maioria dos devs que conheço nunca tentou fazer um jogo porque acha que precisa aprender Unity ou Unreal. Mas se você já mexeu com animações CSS, state management ou physics simulators básicos pra UI, você já cruzou metade da ponte. Game jams forçam escopo pequeno — você não vai fazer Elden Ring em três semanas, vai fazer um Snake com twist. E isso cabe perfeitamente no que o browser oferece. Além disso, jogos web rodam em qualquer lugar. Sem instalador, sem App Store review, sem build pra cinco plataformas. Você manda um link e qualquer um joga. Pra um jam onde o pessoal precisa testar dezenas de jogos rápido, isso importa. Canvas API: Seu Motor Gráfico Embutido O <canvas> existe desde 2010 e faz exatamente o que você precisa: desenhar pixels, shapes e imagens num loop de 60fps. A estrutura básica de qualquer jogo 2D cabe em 30 linhas: const canvas = document . querySelector ( ' canvas ' ); const ctx = canvas . getContext ( ' 2d ' ); const gameState = { player : { x : 50 , y : 50 , speed : 2 }, enemies : [] }; function update ( deltaTime ) { // Input handling if ( keys [ ' ArrowRight ' ]) gameState . player . x += gameState . player . speed ; if ( keys [ ' ArrowLeft ' ]) gameState . player . x -= gameState . player . speed ; // Game logic gameState . enemies . forEach ( enemy => { enemy . x += Math . sin ( Date . now () / 1000 ) * 0.5 ; }); } function render () { ctx . clearRect ( 0 , 0 , canvas . width , canvas . height ); // Draw player ctx . fillStyle = ' #00ff00 ' ; ctx . fillRect ( gameState . player . x , gameState . player . y , 20 , 20 ); // Draw enemies gameState . enemies . forEach ( enemy => { ctx . fillStyle = ' #ff0000 ' ; ctx . fillRect ( enemy .
开发者
Celebrating 20 Years of InfoQ
InfoQ celebrates its 20th anniversary. To mark the occasion, we have published a walk-through of the trends InfoQ called early, where they sit on the adoption curve today, and how that curve may evolve over the next decade. By InfoQ
AI 资讯
Batch Certificate Generation with n8n — 200+ Certs in 2.5 Minutes
Every time a course batch completes, you have a list of students who need certificates. The manual way: open Canva, duplicate the template, change the name, export, repeat — for every single student. If you have 10 students, that's annoying. If you have 200, that's a full afternoon. The better way A single n8n workflow that: Reads student names from Google Sheets Calls the RenderPix batch API Gets back 200 certificate images Emails each student their certificate Total time: ~2.5 minutes. Total manual work: zero. What you'll need A RenderPix account (free tier works for testing, Starter plan for production) n8n (self-hosted or cloud) n8n-nodes-renderpix community node A Google Sheet with student data Install the n8n node: npm install n8n-nodes-renderpix Or search "RenderPix" in n8n's community node panel. Step 1 — Design your certificate template Write your certificate in plain HTML. Here's a clean starting point: <div style= "width:1200px;height:850px;background:white; display:flex;flex-direction:column;align-items:center; justify-content:center;border:20px solid #0f172a; font-family:Georgia,serif;padding:60px;box-sizing:border-box" > <div style= "font-size:16px;letter-spacing:5px;color:#64748b; text-transform:uppercase;margin-bottom:24px" > Certificate of Completion </div> <div style= "width:80px;height:2px;background:#22d3ee;margin-bottom:32px" ></div> <div style= "font-size:52px;font-weight:700;color:#0f172a;margin-bottom:16px" > {{name}} </div> <div style= "font-size:18px;color:#475569;text-align:center;max-width:600px" > has successfully completed </div> <div style= "font-size:28px;font-weight:600;color:#1e293b;margin:16px 0 40px" > {{course}} </div> <div style= "font-size:14px;color:#94a3b8" > {{date}} </div> </div> Notice the {{name}} , {{course}} , {{date}} placeholders — RenderPix replaces these at render time. Step 2 — Set up Google Sheets Create a sheet with these columns: name course date Jane Smith Advanced n8n Automation June 2026 John Doe Advanced n8n
AI 资讯
Zero Reaches 1.0, Marking the First Stable Release of Rocicorp's Web Sync Engine
Rocicorp has released Zero 1.0, a stable version of its sync engine after two years of development. This update introduces a schema change hook for Supabase and includes bug fixes. Zero operates by pairing a client library with a read-only Postgres cache. Community feedback highlights positive developer experience but raises concerns about production readiness and existing limitations. By Daniel Curtis
AI 资讯
How I Built a Browser-Based File Compression Tool for India Using Canvas API and pdf-lib — No Backend Needed
I built ResizeKB — a free image and PDF resizer built specifically for Indian users. 25+ tools. Zero server uploads. Pure HTML, CSS, JavaScript. Here's how and why. The Problem Every Indian applying for government jobs, exams, or bank accounts hits the same wall — portals with strict KB limits rejecting documents. UPSC wants photo under 300KB. SSC wants under 50KB. Banks need Aadhaar PDF under 500KB. Every portal is different. Every rejection wastes someone's time and opportunity. Most people have no idea how to resize to an exact KB. They either give up or use random tools that upload their Aadhaar and PAN card to unknown servers. I built a tool that solves this in one click — with zero server upload. The Tech Stack No framework. No backend. No database. Canvas API for image processing pdf-lib for PDF compression Vanilla JavaScript only Cloudflare Pages for hosting — free, global CDN, auto deploys from GitHub Total infrastructure cost: ₹1,162 per year for the domain. Everything else free. Image Compression — The Binary Search Algorithm The core challenge is compressing to an exact KB target without over-compressing. Most tools use a fixed quality setting like 60% which destroys image quality. The right approach is binary search on JPEG quality: javascriptasync function compressToTargetSize(file, targetKB) { const targetBytes = targetKB * 1024; let low = 0.1; let high = 1.0; let result = null; const img = await loadImage(file); const canvas = document.createElement('canvas'); canvas.width = img.width; canvas.height = img.height; const ctx = canvas.getContext('2d'); ctx.drawImage(img, 0, 0); while (high - low > 0.01) { const mid = (low + high) / 2; const blob = await canvasToBlob(canvas, 'image/jpeg', mid); if (blob.size <= targetBytes) { result = blob; low = mid; } else { high = mid; } } return result; } This finds the highest quality setting that still hits your target KB. Result is the sharpest possible image at that file size — never over-compressed. PDF Compress
AI 资讯
Why I stopped pasting into online Fake Data Generator tools
Every online Fake Data Generator tool I used had the same quiet flaw: whatever you paste gets POSTed to someone's server. For a Fake Data Generator, that paste is often exactly the sensitive thing — a token, a config, an API response. So I built Fake Data Generator to not do that. Generate fake names, emails, UUIDs, addresses — custom columns, CSV/JSON export. 100% browser-side — and it runs entirely in your browser, so there's nothing to send and nothing to breach. You don't have to take my word for it: open DevTools → Network, use the tool, and watch the tab stay empty. One HTML file, View-Source-able. https://faker.platotools.com/ It's part of platotools.com — a set of single-purpose, client-side dev tools. Feedback and edge-case bug reports very welcome.
AI 资讯
Fix: babel-plugin-transform-flow-strip-types broken in Babel 7 and 8
The original babel-plugin-transform-flow-strip-types hasn't been updated in 9 years and breaks silently in Babel 7 and 8 environments. The fix I published a maintained fork that works as a drop-in replacement: npm install --save-dev babel-plugin-transform-flow-strip-types-maintained Then update your .babelrc: { "plugins": ["transform-flow-strip-types-maintained"] } That's it. No other changes needed. What's fixed Babel 7 and 8 peer dependency conflicts Missing syntax plugin declaration Deprecated visitor patterns allowDeclareFields support Automated migration If you want to update your entire project automatically: npx flow-strip-migrate . This updates your package.json and babel config in one command. More info: https://flowstrip.netlify.app npm: https://www.npmjs.com/package/babel-plugin-transform-flow-strip-types-maintained
开源项目
🔥 chinese-poetry / chinese-poetry - The most comprehensive database of Chinese poetry 🧶最全中华古诗词数据
GitHub热门项目 | The most comprehensive database of Chinese poetry 🧶最全中华古诗词数据库, 唐宋两朝近一万四千古诗人, 接近5.5万首唐诗加26万宋诗. 两宋时期1564位词人,21050首词。 | Stars: 51,677 | 95 stars today | 语言: JavaScript
开源项目
🔥 Acode-Foundation / Acode - Acode - powerful text/code editor for android
GitHub热门项目 | Acode - powerful text/code editor for android | Stars: 5,511 | 20 stars today | 语言: JavaScript
开源项目
🔥 sveltejs / kit - web development, streamlined
GitHub热门项目 | web development, streamlined | Stars: 20,556 | 4 stars today | 语言: JavaScript
开源项目
🔥 NomaDamas / k-skill - 한국인을 위한 스킬 모음집 - SRT, KTX, 카카오톡, 한글과컴퓨터, 날씨, 미세먼지, 법령, 주식정보,
GitHub热门项目 | 한국인을 위한 스킬 모음집 - SRT, KTX, 카카오톡, 한글과컴퓨터, 날씨, 미세먼지, 법령, 주식정보, 조선왕조실록, KBO, K-리그, LCK, 특허 검색, 토스 증권, 맞춤법 검사, 중고차 가격, 쿠팡, 네이버 블로그, 다이소, 올리브영, 택배 송장 조회 등등... | Stars: 5,411 | 19 stars today | 语言: JavaScript
开源项目
🔥 datawhalechina / easy-vibe - 💻 vibe coding 2026 | Your first modern Coding course beginne
GitHub热门项目 | 💻 vibe coding 2026 | Your first modern Coding course beginners to master step by step. | Stars: 16,458 | 151 stars today | 语言: JavaScript
AI 资讯
Building a Privacy-First Media Converter in the Browser: No Servers, No Cloud, 100% Client-Side (RAM-Friendly)
Most online file converters require uploading your documents, images, or videos to an unknown server. This is slow, inconvenient, and raises serious privacy concerns. I decided to build something different: a converter that works entirely inside your browser. Processing large files without a backend presents two main engineering challenges: How do you avoid consuming all available RAM? How do you prevent the user interface from freezing? This article explains how I solved these problems using OPFS, Web Workers, and a Backpressure mechanism. The result is a working tool you can try right now: PixelForge Free . The Architecture at a Glance Here is the simplified data flow of the entire pipeline: Drag & Drop → OPFS (Virtual Disk) → Worker Pool (Backpressure) → ZIP Stream → Download Problem 1: Out-of-Memory (OOM) Crashes The Challenge: Loading many files directly into the browser's memory is impossible. A user dropping a folder with 100+ high-resolution images would instantly crash the tab. The Solution: Origin Private File System (OPFS) OPFS provides a fast, isolated virtual disk inside the browser. Instead of loading files into RAM, my pipeline intercepts the drop event and streams the raw binary data directly to this virtual disk. Here is a simplified version of how it works: // Get a reference to the virtual disk const root = await navigator . storage . getDirectory (); const fileHandle = await root . getFileHandle ( `input_ ${ id } .raw` , { create : true }); // Create a writable stream to the disk const writable = await fileHandle . createWritable (); // Stream the file directly from the user's computer to the virtual disk await file . stream (). pipeTo ( writable ); This allows the application to accept a folder with 500+ items without consuming more than a few megabytes of actual RAM. The data stays on the user's SSD, not in memory. Problem 2: UI Freezing The Challenge: Image compression, PDF parsing, and video encoding are CPU-intensive operations. Running them
AI 资讯
async/await is a Generator in Disguise. Let's Build It From Scratch
You write await a dozen times before lunch. Fetch a row, await it. Call a service, await that. It works, you move on, and you never have to think about what the word is doing. Then one day someone asks you to explain it. Maybe it's an interviewer."But what does await actually do?" And you open your mouth and what comes out is "it, uh, waits for the promise." Which is true, and also explains nothing. We can build async/awit mechanism from scratch using generators as a learning exercise. It requires a pause button wired to a small loop that waits on a promise and then presses play again. You already know one half of that machinery if you read the last post in this series . The other half is a trick generators have that we glossed over. Put the two together and you can build a working version of async/await yourself, by hand, and watch it behave exactly like the real thing. Let's do that. The shape of the problem Strip await down to what it has to accomplish and you get two requirements: First, a function has to be able to stop in the middle. Right at the await, freeze everything, the local variables, the spot in the loop, all of it, and hand control back to whoever called it. Normal functions can't do this. They run start to finish and that's the deal. Second, something on the outside has to wait for the promise to settle and then nudge the frozen function back to life, handing it the resolved value as if the await expression had simply evaluated to it. That's the whole job. A function that pauses, and a driver that resumes it when a promise is ready. Hold that picture, because the rest of this is just filling in those two pieces with things JavaScript already gives you. The half you've seen: pausing A generator function, the function* kind, can pause itself with yield and resume later from the exact same spot. We leaned on that hard in the CSV piece to pull rows through a pipeline one at a time. A line came in, got yielded, and the generator sat frozen until someone