Frontend Feeds

Today

Front-end, in one read.

The latest from the sources worth following, newest first.

  • DEV CommunityThe Giantsread at source

    Hệ Thống Unicode (Unicode System) Trong Java

    Unicode là gì? ↳ Unicode là một chuẩn mã hóa ký tự được sử dụng rộng rãi trong ngành công nghệ máy tính. Mục tiêu của Unicode là cung cấp một cách thức thống nhất và duy nhất để biểu diễn các ký tự từ tất cả các ngôn ngữ viết trên thế giới. ↳ Unicode sử dụng hệ thập lục phân (hexadecimal) để biểu thị các ký tự. Ví dụ, giá trị 0x0041 tương ứng với ký tự Latin A. ↳ Lý do ban đầu cho việc sử dụng 16 bit để mã hóa ký tự trong Unicode là vì các máy tính thời điểm đó chủ yếu là máy tính 16 bit. Ảnh mô tả xử lý mã hóa ký tự trong java Unicode và Java ↳ Khi ngôn ngữ lập trình Java được phát triển, chuẩn Unicode đã được chấp nhận và kiểu dữ liệu char được định nghĩa là kiểu 16 bit, có thể lưu trữ các ký tự trong phạm vi từ 0x0000 đến 0xFFFF. ↳ Tuy nhiên, mã hóa 16 bit chỉ hỗ trợ tối đa 2^16 (65,536) ký tự, không đủ để chứa tất cả các ký tự trên thế giới. Do đó, chuẩn Unicode đã được mở rộng lên 0x10FFFF, hỗ trợ hơn một triệu ký tự. ↳ Vấn đề đặt ra là không thể thay đổi định nghĩa của một ký tự trong Java từ 16 bit sang 32 bit vì điều này sẽ khiến hàng triệu ứng dụng Java hiện có không còn hoạt động bình thường. Thuật ngữ trong Unicode ↳ Ký tự (character): Là đơn vị nhỏ nhất của văn bản, mang ý nghĩa ngữ nghĩa. Ví dụ: a, b, c, $, €, こんにちは (konnichiwa). ↳ Bộ ký tự (character set): Là tập hợp các ký tự có thể được sử dụng bởi nhiều ngôn ngữ. Ví dụ: Bộ ký tự Latin được sử dụng bởi tiếng Anh và hầu hết các ngôn ngữ châu Âu, trong khi bộ ký tự Hy Lạp chỉ được sử dụng bởi tiếng Hy Lạp. ↳ Bộ ký tự mã hóa (coded character set): Là bộ ký tự trong đó mỗi ký tự được gán một số duy nhất. ↳ Điểm mã (code point): Là giá trị được sử dụng trong bộ ký tự mã hóa. Một điểm mã là kiểu dữ liệu int 32 bit, trong đó 21 bit thấp hơn biểu thị giá trị điểm mã hợp lệ và 11 bit cao hơn bằng 0. ↳ Đơn vị mã Unicode (Unicode code unit): Là giá trị char 16 bit. Ví dụ: Chuỗi "abc" tiếp theo bởi ký tự Deseret LONG I (ký tự này được biểu diễn bằng hai giá trị char). Chuỗi đó chứa bốn ký tự, bốn điểm mã nhưng có tới năm đơn vị mã. ↳ Ký hiệu Hexa (hexadecimal): Để biểu diễn một ký tự trong Unicode, giá trị hexa được thêm tiền tố U+. ↳ Phạm vi điểm mã Unicode hợp lệ: Là từ U+0000 đến U+10FFFF. Giá trị điểm mã cho ký tự Latin A là U+0041. Ký tự € (đại diện cho đơn vị tiền tệ Euro) có giá trị điểm mã U+20AC. Ký tự đầu tiên trong bảng chữ cái Deseret, LONG I, có giá trị điểm mã U+10400. Bảng dưới đây hiển thị giá trị điểm mã cho một số ký tự: Ký tự Điểm mã Unicode Hình tượng Latin A U+0041 A Latin ß (sharp S) U+00DF ß Hán tự Đông (Đông) U+6771 東 Deseret, LONG I U+10400 𐐀 ↳ Ký tự bổ sung (supplementary character): Là ký tự nằm trong phạm vi từ U+10000 đến U+10FFFF. ↳ Mặt phẳng đa ngôn ngữ cơ bản (Basic Multilingual Plane - BMP): Là tập các ký tự từ U+0000 đến U+FFFF. Tiềm hiểu rõ hơn về hệ thống Unicode trong Java : Tại đây

  • DEV CommunityThe Giantsread at source

    Still Renewing Tomcat and Spring Boot Certificates by Hand? How to Automate Renewal and Deployment

    With Nginx, a renewed certificate is two PEM files and a reload. Tomcat and Spring Boot usually load a keystore instead ( .jks or .p12 ), so each renewal also means downloading the Tomcat-format certificate from your CA or cloud console, or running openssl pkcs12 or keytool to build a keystore yourself, then replacing the old file and restarting the app. That's fine once a year. Public certificates issued today are already capped at 200 days, the cap drops to 100 days on March 15, 2027, and to 47 days on March 15, 2029. At that point you are doing it roughly every month. This post covers how to automate renewal for Java apps: first check whether the app loads the certificate at all, then the Tomcat and Spring Boot settings that matter, the three errors that most often break a certificate swap, and two ways to automate the whole thing: a Certbot hook you maintain yourself, or LapseZero as a hosted service. Check where HTTPS terminates Many Java apps sit behind Nginx, HAProxy or a cloud load balancer that handles TLS, while Tomcat listens on plain HTTP on port 8080. In that setup the certificate has nothing to do with Java. Renew it the way you would for Nginx or the load balancer and skip the keystore work. To check: in Tomcat, look for a Connector with an SSLHostConfig in conf/server.xml . In Spring Boot, look for server.ssl in application.yml , application.properties or the startup arguments. If neither is there, the Java app usually doesn't load a certificate. The rest of this post assumes it does. Tomcat Since Tomcat 8.5 (including 9, 10 and 11), TLS settings go in an SSLHostConfig inside the Connector: port= "8443" protocol= "org.apache.coyote.http11.Http11NioProtocol" SSLEnabled= "true" > certificateKeystoreFile= "/opt/tomcat/ssl/tomcat.p12" certificateKeystorePassword= "changeit" certificateKeystoreType= "PKCS12" /> For automation, four attributes on Certificate matter: certificateKeystoreFile is where the renewed keystore has to be written. certificateKeystorePassword has to match the password the new keystore is built with. certificateKeystoreType defaults to JKS when omitted. Use PKCS12 and set it explicitly. certificateKeyAlias is left out above. Without it, Tomcat uses the first key it reads from the keystore, which is the simplest option when the keystore holds a single certificate. You can also skip keystores. Tomcat 8.5 and later read PEM files directly through certificateFile , certificateKeyFile and certificateChainFile . There is no need to switch an existing keystore setup to PEM just to automate it; both work. Once the file is replaced, Tomcat has to load it. A restart is the simplest way, and HTTPS is down while it runs: on a small test VM, a normal Tomcat 10.1 restart took HTTPS offline for about 7 seconds. To avoid the gap, the Manager app has an sslReload command that re-reads the certificate and key files without re-parsing server.xml : curl -fsS -u deployer:password "http://localhost:8080/manager/text/sslReload" | grep -q '^OK' This needs the Manager app deployed and a user with the manager-script role. When the reload fails, Manager answers with text starting with FAIL and curl still exits 0, so the grep is what turns a failed reload into a non-zero exit code. Spring Boot Spring Boot runs an embedded Tomcat and reads the certificate from its own configuration: server : port : 8443 ssl : key-store : file:/opt/app/ssl/app.p12 key-store-type : PKCS12 key-store-password : changeit This works the same in Spring Boot 2.7 and 3.x. Watch the file: prefix. A lot of tutorials use classpath:keystore.p12 , which bundles the keystore into the jar. Then a new certificate means a new build and a new release, and nothing on the server can replace it. Move the keystore out of the jar and point key-store at an absolute file: path before automating anything. Spring Boot also accepts PEM files: server.ssl.certificate for the chain and server.ssl.certificate-private-key for the key. From Spring Boot 3.2 you can swap certificates without a restart. Define the certificate as an SSL bundle with reload-on-update enabled and Spring Boot watches the files in the background, reloading them when they change: spring : ssl : bundle : jks : web : reload-on-update : true keystore : location : file:/opt/app/ssl/app.p12 password : changeit type : PKCS12 server : ssl : bundle : web The bundle type is called jks , but it holds PKCS12 files too; type decides. server.ssl.bundle can't be combined with server.ssl.key-store and the other keystore properties, so remove those when you switch. On versions before 3.2, a restart is the only option. Spring Boot also starts slower than plain Tomcat: on the same test VM, a minimal Spring Boot 3.5 app was unreachable over HTTPS for about 15 seconds during a restart, and real applications usually take longer. Three errors that break a certificate swap The alias doesn't match Many Tomcat guides create the keystore with keytool -alias tomcat and set certificateKeyAlias="tomcat" (or server.ssl.key-alias: tomcat in Spring Boot). Build the renewed keystore with a different tool and the alias may change. On the next start the app fails with: java.io.IOException: Alias name [tomcat] does not identify a key entry You won't see this while the app is running, because it keeps the old certificate in memory. It shows up on the first restart after renewal, when the app refuses to start. Either build the new keystore with the same alias ( openssl pkcs12 -export -name tomcat ), or, if the keystore only ever holds one certificate, remove the alias from the config. The password doesn't match The new keystore's password has to equal certificateKeystorePassword or server.ssl.key-store-password . Otherwise startup fails with: Failed PKCS12 integrity checking A JKS file from a CA or cloud console sometimes has a key password that differs from the keystore password, which shows up as certificateKeyPassword in Tomcat or server.ssl.key-password in Spring Boot. In a generated PKCS12 file both passwords are the same, so remove that setting or set it to the keystore password. The restart succeeds and the app is down This is the one that slips through. Most systemd units for Java apps use Type=simple , where systemctl restart returns as soon as the process starts, long before Java loads the certificate. With a wrong alias or password, systemctl restart still exits with 0. Tomcat keeps running without its HTTPS connector; Spring Boot exits a few seconds later. Your deploy script sees a successful command and moves on while the service is down. So the restart step should only succeed once HTTPS actually answers, and fail otherwise: #!/bin/sh # Usage: restart-and-wait.sh set -eu systemctl restart " $1 " for attempt in $( seq 1 30 ) ; do if curl --insecure --fail --silent --max-time 1 "https://127.0.0.1: $2 /" > /dev/null ; then exit 0 fi sleep 1 done echo " $1 did not become HTTPS-ready" > &2 exit 1 --insecure is only there because this is a local liveness check. Replace / with a path in your app that returns 200 without a login. The first time you automate this, also check file permissions. The Java process usually runs as a non-root user, and it has to be able to read the newly written keystore. Doing it yourself with a Certbot deploy hook If Certbot issues the certificate on the same server, put the conversion, the swap and the restart in a deploy hook. Certbot runs it after each successful renewal and passes the certificate directory in RENEWED_LINEAGE : #!/bin/sh set -eu openssl pkcs12 -export \ -in " $RENEWED_LINEAGE /fullchain.pem" \ -inkey " $RENEWED_LINEAGE /privkey.pem" \ -name tomcat -passout file:/etc/tomcat/keystore.pass \ -out /opt/tomcat/ssl/tomcat.p12.new mv /opt/tomcat/ssl/tomcat.p12.new /opt/tomcat/ssl/tomcat.p12 /usr/local/bin/restart-and-wait.sh tomcat 8443 acme.sh doesn't set RENEWED_LINEAGE . Use --install-cert to choose where the full chain and private key are written, point the script at those paths, and run it through --reloadcmd . For one app on one server, that's enough. With more servers and apps, a few things are left to you: Recovery: if the restart fails, the old keystore has already been overwritten. Keep a backup and restore it on failure, or the app stays down until someone fixes it. Distribution: the renewed certificate only exists on the machine where Certbot runs. For several servers you either run Certbot and the hook on each one, or copy the certificate over and run the same steps everywhere. Alerts: Certbot doesn't notify anyone by default. A failed hook only shows up in its log, so nobody knows unless someone reads it. Deploying to Java apps with LapseZero LapseZero is a hosted service that issues certificates, renews them before they expire and deploys them to servers and cloud services. The certificates are free DV certificates with wildcard support, validated over DNS with either a DNS provider API key or a single CNAME record. Nothing needs to be migrated: the first deployment writes the new certificate to your existing keystore path. A Java server is set up once. Add a deployment target, choose Server , pick Tomcat or Spring Boot , and fill in three fields: Certificate Path : the keystore path from your config, without the file: prefix for Spring Boot. Keystore Password : the same password as in your config. If your config sets a key alias, enter that alias too. Post-deploy Command : the restart-and-wait.sh script above. LapseZero connects over SSH or through a deployment agent that needs no inbound port. Private keys and passwords are stored encrypted. From then on, every renewal builds a new PKCS12 file, writes it to the same path and runs your command, and the three errors above stop being your problem. The keystore is built with your password and alias, so they match. If the command fails, for example because the app isn't serving HTTPS within 30 seconds, LapseZero puts the old keystore back and runs the command again, so the app keeps the old certificate and the notification tells you it was rolled back. Add the app's HTTPS address under Live check and each deployment also confirms the new certificate is actually being served. For an app on several servers, add one deployment target per server with the same settings. The Nginx, load balancer or cloud services in front of it get the same certificate from the same place, with no hook script to maintain on every machine. The free plan covers 3 domains and 5 deployment targets with no time limit, enough to try it on one or two servers. One domain on six servers is past the free plan; Starter is $3/month for 10 domains and 20 deployment targets.

  • DEV CommunityThe Giantsread at source

    The Free, Open-Source ElevenLabs Rival Sweeping GitHub: Inside VoiceStudio’s Local-First Audio Revolution

    The generative AI landscape has spent the past few years democratizing large language models for local execution. Yet, high-fidelity neural audio—specifically speech generation, voice cloning, and timed video dubbing—has remained predominantly tied to cloud platforms. Creators and developers looking for expressive text-to-speech or precise voice replication usually end up funneling audio through hosted SaaS providers charging by the character or monthly credit allotment. That paradigm is evolving as desktop software catches up with rapid open-source research. VoiceStudio , a free and open-source project initiated by creator Palash Debnath and now maintained alongside a growing community team, has surpassed 90,000 stars on GitHub. Designed as a local-first desktop application, VoiceStudio integrates voice cloning, voice design, video dubbing, dictation, transcription, and audiobook creation into a unified workspace. Rather than relying on cloud subscriptions, compatible local workflows run on your own hardware without requiring external API calls. Moving Beyond Metered Cloud APIs For creators, developers, and privacy-conscious organizations, cloud-based voice platforms present operational bottlenecks. Subscriptions enforce artificial character caps, and processing sensitive interviews, unreleased voice acting, or confidential internal video materials through remote third-party servers presents compliance and privacy challenges. VoiceStudio provides an alternative by shifting inference to local silicon. While remote services remain an optional integration, local workflows allow audio processing to stay entirely on your machine. Usage analytics, where present, are strictly opt-in, giving users control over their data footprint. Architecture: How VoiceStudio Connects Electron to PyTorch Rather than offering a simple wrapper around a single command-line script, VoiceStudio uses a decoupled architecture designed to keep the desktop interface responsive during heavy tensor calculations: Desktop Shell: Built with Electron, providing a multi-tab workspace, visual waveform editors, and project tracking. Local Python Backend: A background daemon manages execution, virtual environment isolation, and PyTorch dependencies. Engine Layer: Modular adapters interface directly with various neural speech models and text-to-speech backends. Local API & MCP Support: A local HTTP/WebSocket API allows external scripts to trigger inference programmatically. Native support for the Model Context Protocol (MCP) enables compatible local AI agents (such as coding assistants) to invoke speech and transcription tasks directly. +-------------------------------------------------------------+ | Electron Frontend | | (GUI Workspaces, Waveforms, Settings) | +------------------------------+------------------------------+ | IPC / Local WebSockets +------------------------------v------------------------------+ | Local Python Backend | | (Environment Manager, Model Scheduler) | +------+-----------------------+-----------------------+------+ | | | +------v-------+ +------v-------+ +------v-------+ | OmniVoice | | WhisperX | | Other Speech | | (Speech) | | (Transcribe) | | Engines | +--------------+ +--------------+ +--------------+ The Multi-Engine Advantage: Customizing Performance and Fidelity A critical distinction often overlooked is that VoiceStudio is an overarching application workspace, not a standalone AI model . Its core strength lies in its Model Manager, which orchestrates multiple underlying engines depending on your hardware limits and production goals: Default Engine (OmniVoice): Maintained under k2-fsa/OmniVoice , this engine provides zero-shot voice cloning capabilities. It advertises support across 600+ languages and dialects, making it a flexible starting point for multi-lingual synthesis. Specialized Backends: The catalog supports backends like WhisperX and Faster-Whisper for accelerated, word-level audio alignment and transcription, as well as alternative generation engines optimized for different acoustic qualities. Because different models make distinct trade-offs—some prioritize low-latency inference on mid-range CPUs, while others require high GPU VRAM for maximum acoustic fidelity—VoiceStudio lets users download and switch between engines as project requirements change. While the full catalog advertises support covering up to 646 languages, actual language availability, synthesis speed, and output quality depend directly on the specific model chosen. Core Workspaces and Capabilities VoiceStudio consolidates disparate audio tasks into structured tabs: Voice Synthesis and Zero-Shot Cloning For zero-shot cloning, users can supply a brief, clean reference clip (with the default engine documentation referencing clips as brief as three seconds) to extract acoustic speaker embeddings. For scenarios where replicating a real person is unnecessary or inappropriate, the Voice Design tool builds synthetic vocal identities using text prompts and acoustic parameter adjustments. Timed Video Dubbing and Long-Form Workflows Localization often breaks down over timing alignments. VoiceStudio includes a video dubbing workspace where generated audio tracks match visual frame timestamps. Paired with batch processing tools, creators can assemble long-form audiobooks or multi-chapter narratives without hitting token limits. System-Wide Dictation and Local Transcription Reverse workflows are supported via system-wide floating dictation widgets, sending transcribed speech directly into active desktop windows. For pre-recorded media, transcription backends like Faster-Whisper generate time-stamped text files locally. Workflow Example: Building an Educational Video Pipeline To see how these components interact in practice, consider a Linux-based technical educator producing a multi-language video series: [Write Script] ──> [Voice Profile Synthesis] ──> [Batch Render Narration] | [Publish English Video] [Dubbing Workspace + Local Model] ──> [Export Translated Audio Track] Scripting and Narration: The creator writes a script in Markdown and generates narration using a saved, custom-built voice profile. Review and Edit: Using the waveform editor, individual lines are re-rendered with adjusted pitch or speed parameters to match visual cuts. Localization: The creator feeds the finalized audio into the dubbing workspace, using a multi-lingual engine backend to translate and align a second language audio track. Instead of managing four single-purpose web platforms, three subscription tiers, and multiple command-line utilities, the entire pipeline is handled inside a single desktop application. Platform Acceleration and Hardware Setup on Linux Running VoiceStudio on Linux requires matching your hardware configuration to the appropriate backend acceleration stack: NVIDIA GPUs: Acceleration is handled natively via CUDA. AMD GPUs: Compatible systems can leverage ROCm support for acceleration. Vulkan Support: Select GGUF-based engine models support Vulkan execution, providing acceleration across broader GPU hardware. CPU-Only Fallback: Systems without discrete GPUs can execute models on the system CPU. Disk Footprint & Installation Requirements Installation on Linux is initiated via an automated setup script: curl -fsSL https://voicestudio.sh/install | sh During setup, the installer allocates the local application binaries and Python virtual environment. Storage Allocation: The documentation recommends roughly 10 GB of total free disk space for a standard installation, including the application code, dependencies, and baseline model weights. CPU Runtime Setup: If opting for a dedicated CPU fallback environment, approximately 5 GiB of free space is required for the optimized CPU runtime binaries. On-Demand Downloads: The installer does not force a download of every model engine upfront. The Model Manager prompts for explicit user confirmation before fetching additional model weights from remote repositories. (Note: Apple Silicon MPS acceleration applies specifically to native macOS builds, not Linux distributions.) System Limits, Setup Footprint, and Trade-Offs While VoiceStudio offers a comprehensive feature set, running AI models locally introduces practical trade-offs: Initial Download Overhead: Operating offline requires local model weights. While the initial setup stays moderate, populating multiple high-fidelity engines will quickly consume tens of gigabytes of disk space. Hardware Constraints on CPU: Running multi-gigabyte neural models purely on system CPUs is functional, but inference times will be significantly slower compared to dedicated CUDA or ROCm GPU acceleration. Responsible Model Usage: Voice cloning features carry obvious potential for misuse. VoiceStudio includes provenance notices within its Model Manager to track engine sources, but enforcing consent-based cloning remains the end-user's responsibility. Verdict: Who Benefits Most from VoiceStudio? VoiceStudio is a well-structured open-source project that bridges the gap between modern neural audio research and desktop software design. For users seeking instant web-based generation without local hardware setup, commercial cloud APIs remain simpler. However, for Linux developers, privacy-minded audio producers, and creators looking to build modular, offline audio pipelines without subscription lock-in, VoiceStudio offers an extensible, local-first workspace worth evaluating. To review the code or contribute, visit the official GitHub repository at debpalash/VoiceStudio or consult the documentation at voicestudio.sh .

  • DEV CommunityThe Giantsread at source

    Leaner Sites, Cheaper Reviews, and Tetris Becomes Snake

    Signup here for the newsletter to get the weekly digest right into your inbox. Find the 9 highlighted links of weeklyfoo #160: How D1 scales to millions of databases by Cloudflare Scaling the D1 control plane for millions of SQLite databases without routing every query through a central bottleneck 📰 Good to know, cloudflare, databases, scale Cutting our inference bill by 68% by Cloudflare Cloudflare dropped average AI code review cost from $2.43 to $0.77, mostly by ordering messages so first requests actually hit the prompt cache 📰 Good to know, ai, llm, cost Building Laminar, Ramp's managed agents platform by Ramp A model-agnostic agent harness on Postgres, Temporal and S3 with session state independent of disposable sandboxes, async steering, subagents and shared tracing 📰 Good to know, ai, agents, architecture React only where needed, moving from Next.js to Astro by Owner 10,000+ restaurant sites moved to Astro and Cloudflare Workers with React islands, menu-page p75 LCP went from 5.4s to 0.7s 📰 Good to know, performance, astro, react php2shell, how the PHP RCE works by Wiz A multipart POST exhausts memory mid-parse, then the shutdown cleanup follows a planted pointer and runs the attacker's payload, regardless of the app on top 📰 Good to know, security, php PGX by PGRun Hosts thousands of isolated throwaway Postgres databases in one process, cloned from a template in milliseconds, for agent sandboxes and per-PR tests 🧰 Tools, postgres, testing, ai env.style by Ryan George Wraps your Next.js or Vite config to tint the favicon per environment so you see at a glance where you are 🧰 Tools, dx, nextjs, vite The Tetris script that becomes Snake once prettified by Robert Vähhi Chaining semantic quirks in pretty-printers and deobfuscators turns the cleaned-up output into a different program 🤪 Fun, javascript, security, fun What happens when AI writes your C++ code? by Greg Law, Mark Williamson Benchmarking how well LLMs debug a half-million line C++ codebase, where they still lag at debugging versus writing 📺 Videos, ai, cpp, debugging Want to read more? Check out the full article here . To sign up for the weekly newsletter, visit weeklyfoo.com .

  • DEV CommunityThe Giantsread at source

    How I preview noise reduction before paying for full audio cleanup

    When I record interviews or podcasts, the first question is usually not "which model is best" — it is "will cleanup actually help this take?" I got tired of uploading a full file to a paid tool, waiting, then finding the take was still too noisy. So I built EraseNoise around a free 30-second before/after preview in the browser. What it does Upload audio or video (MP3, WAV, M4A, AAC, OGG, Opus, FLAC, MP4, MOV, M4V, WebM; up to 2 GB) Listen to the first 30 seconds cleaned vs original for free If it sounds better, process the rest and download WAV or MP4 (video keeps the picture) Extra tools for echo, reverb, buzz/hum, applause, and a free in-browser silence cutter Uploads and results are deleted after 24 hours Why preview-first Most noise tools sell the full run. Preview-first keeps the loop honest: you only pay when the cleaned speech is clearly better for that recording. Try it: https://erasenoise.com/ Feedback welcome — especially on edge cases (wind, AC hum, overlapping talkers).

  • Hacker News: Show HNLibraries, Frameworks, etc.read at source

    Show HN: Fraktur, a DJ mixing app in the browser

    Comments

  • Hacker News Front PageThe Giantsread at source

    Intel plunges 25%, triggers global chip rout on bleak outlook

  • Hacker News Front PageThe Giantsread at source

    Pompeii wardrobe found untouched since 79CE holds keepsakes, coins, and two mice

  • Frontend Masters BlogMore Front-end Bloggers13 min read

    Two Circles, One Connection, and border-shape

    Swapping the clip-path arrow from the previous article for border-shape and shape(), we can connect two draggable circles with fancy curved lines that stay perfectly aligned.

  • Hacker News Front PageThe Giantsread at source

    Just Noting That Your Candy Corn Is Made of Bug Secretions

  • Hacker News: Show HNLibraries, Frameworks, etc.read at source

    Show HN: Showbuild – Hacker News but only for builders

    Comments

  • Hacker News Front PageThe Giantsread at source

    The $6.3B Binance Hack Was Pulled Off in Just 20 Minutes

  • Hacker News Front PageThe Giantsread at source

    US Reps Lead Democratic Resolution Opposing A.I. Bubble Bailout for Big Tech

  • Hacker News: Show HNLibraries, Frameworks, etc.read at source

    Show HN: Tyrtulia, a headless forum with no passwords, made for the terminal

    Comments

  • Flavio CopesMore Front-end Bloggersread at source

    Build a tiny site-audit crawler with Workers and Queues

    Build a bounded Cloudflare crawler with Workers, Queues, and D1 to find broken pages, missing titles, and redirect chains in a local test site.

  • Flavio CopesMore Front-end Bloggersread at source

    The best voice to text apps for a Mac

    Handy is the free open source dictation app I use. Compare the other Mac voice to text apps and speech APIs, then dictate a prompt.

  • PiccalilliMore Front-end Bloggersread at source

    The Index: Issue #204

    CSS-Tricks has a new owner! This really is a big win for the web and it should fill you with hope. We're not done yet ! The Serotonium — Music shared with friends This does exactly what is says on the tin and the volume of extremely good recommendations is mind-blowing. Anthropic files its ‘IPO’ — but all the key numbers are missing If the immediate glazing of Anthropic's IPO documents on social media was getting you down, then have a read to get yourself back level again. Digital recipe management for fastidious cooks An interesting look into the world of managing your recipes and what options there are. Local Wikipedia This is such a cool tool that allows you to filter Wikipedia by your chosen location. CSS nesting: use with caution Here's one from the Piccalilli archives that you might have missed to wrap up this issue. P.S. this is a good website . Sponsor message When anyone can make anything, we can make you stand out. AI technologies have given anyone the ability to bring their ideas to life, but to produce a high quality service that actually works for the people it needs to work for requires experience, specialist skills and creativity. We’ve got heaps of all of that here at Set Studio and we've got availability starting in 2027, so check us out and see what we're about. Check out our work

  • Net NinjaYouTube ChannelsVideoWatch on YouTube

    GitHub Copilot App Tutorial #5 - Automations

  • Flavio CopesMore Front-end Bloggersread at source

    Build an agent approval flow that survives a restart

    Build a local approval queue with exact message previews, expiring decisions, rejection, and crash recovery. Test it safely with a fake email provider.

  • Flavio CopesMore Front-end Bloggersread at source

    Lessons for builders from Sam Altman's Cheeky Pint interview

    Eight practical lessons from Sam Altman and John Collison on code scans, agent teams, budgets, and prices customers can predict.

  • Hacker News: Show HNLibraries, Frameworks, etc.read at source

    Show HN: DistractFree-Chrome extension and web app to stop doomscrolling

    Comments

  • Hacker News: Show HNLibraries, Frameworks, etc.read at source

    Show HN: Lasm – Write formally verified webapps in Lean for Node/serverless/edge

    Comments

  • AbduzeedoMulti Author Blogsread at source

    The Web Design of Gleb Kuznetsov’s Portfolio

    Gleb Kuznetsov pairs crisp Swiss typography and generative Natural OS previews in a sharp portfolio web design for the Brain.AI design chief. Most executive portfolios get buried under heavy case-stud...

  • AbduzeedoMulti Author Blogsread at source

    Typography: PP Altera Variable Typeface by Pangram Pangram

    Explore PP Altera, a shapeshifting variable typeface and typography system by Pangram Pangram Foundry with 9 families, 3 axes, and 72 styles. Picking a typeface usually means locking yourself into a s...

  • AbduzeedoMulti Author Blogsread at source

    Inside Omlet: Brand Identity by Ragged Edge

    Ragged Edge crafts a global brand identity for pet hardware pioneer Omlet, pairing an egg-shaped wordmark with witty poster typography. Omlet’s industrial-design founders started their journey with on...

  • AdactioTop Front-end Bloggersread at source

    Thursday session

  • Google for DevelopersYouTube ChannelsVideoWatch on YouTube

    Accelerate shipping to scale with Google Antigravity

  • Heroku BlogCompany/Startup Blogs3 min read

    Securing Your Stack: Recent PHP and eMudhra Updates on Heroku

    Managing critical vulnerabilities often consumes significant engineering time. When two remote code execution flaws hit PHP alongside the eMudhra root certificate compromise, Heroku managed the heavy lifting for their managed runtimes. The post Securing Your Stack: Recent PHP and eMudhra Updates on Heroku appeared first on Heroku .

  • AbduzeedoMulti Author Blogsread at source

    How Matúš Hnát Crafted Book Design for Lucky Star 3rd Ed.

    Matúš Hnát crafts the third-edition book design for Elena Lacková’s memoir, pairing neon Pantone green type with Robert Gabris artworks. Historical memoirs usually get trapped in polite sepia nostalgi...

  • Jim Nielsen’s BlogMore Front-end Bloggersread at source

    Celebrating SIM Cards

    It’s time to celebrate a little win. The other day, my mom contacted me saying her 10-year-old iPhone wouldn’t turn on. After getting a hold of the device and doing some family IT support, I concluded the battery was dead. So I bought her a new (old) one on Walmart (SE 3rd gen., if you must know). Her old phone used a SIM card, so I was expecting the process to go something like this: Take the SIM out of the old phone Put it in the new phone Setup the device Troubleshoot why there was no service Call my Mom’s carrier and work through the issue But step 4 and 5 never happened. The new phone “just” connected. I called her number. I texted it. Everything worked as expected. Everything worked as expected. Everything worked as expected. I didn’t have to Google a single question. I was floored. Flabbergasted. I know I shouldn’t have been because that’s how SIM cards are supposed to work, right? Like that’s the whole promise of a SIM card: you can seamlessly swap them between phones. And in this case, the tech worked exactly as promised. As I write this, I’m kind of amazed at how amazed I am that everything “just worked”. Shout out to anyone who has ever worked on SIM card technology. More things like this please :) Reply via: Email · Mastodon · Bluesky

  • Flavio CopesMore Front-end Bloggersread at source

    When one product pays another

    Stripe Pay sends money between businesses by a profile handle. An agent can prepare the transfer. A person still approves the exact amount.

  • SitePointThe Giantsread at source

    AI, DevOps and the Cost of Hosting: From Idea to Production for $0

    null Continue reading AI, DevOps and the Cost of Hosting: From Idea to Production for $0 on SitePoint .

  • WebAIM BlogBrowsers, engines, etc.4 min read

    Captioned Doesn’t Always Mean Accessible

    Accurate dialogue is only part of accessible video captions. Quality captions also identify speakers, convey meaningful sounds, and provide readable, synchronized text. Whether captions come from an automatic tool or a professional service, this article explains why evaluating the finished viewing experience is essential for people who rely on captions.

  • Jeffrey Zeldman PresentsMore Front-end Bloggers6 min read

    The Day the Focus Died

    If we failed to do this, I feared, we would stop leading the industry and turn into “merely the CSS trick of the week.” The post The Day the Focus Died appeared first on Jeffrey Zeldman Presents .

  • Engineering at MetaCompany/Startup Blogs6 min read

    Catching Bugs Before They Land: JiTTesting’s Human-on-the-Loop Approach at Full Scale

    Over the last year we’ve been sharing our work leveraging large language models to catch bugs on the fly — a novel approach we call Catching Just-in-Time Tests (JiTTests). Now, we’re sharing the results and positive impact we’ve seen with Catching JiTTests deployed into production. Our paper, “Just-in-Time Catching Test Generation at Meta,” fully details [...] Read More... The post Catching Bugs Before They Land: JiTTesting’s Human-on-the-Loop Approach at Full Scale appeared first on Engineering at Meta .

  • Flavio CopesMore Front-end Bloggersread at source

    Pi Durable, Cloudflare Workflows, or Vercel Workflow?

    Compare agent crash recovery with durable workflow platforms. Follow one research task through storage, retries, approvals, and the work you still own.

  • Web Tools WeeklyMulti Author Blogsread at source

    Web Tools Weekly Issue #693

    JS Utils, Testing, Build Tools

  • Microsoft Edge BlogBrowsers, engines, etc.2 min read

    Edge is faster on Windows with Accelerated App Launches

    We're excited to announce that Edge is the first browser to support accelerated app launches on Windows, delivering a faster and more consistent browser launch experience. With accelerated app launch, most Windows users will see a 15% launch The post Edge is faster on Windows with Accelerated App Launches appeared first on Microsoft Edge Blog .

  • Flavio CopesMore Front-end Bloggersread at source

    How to customize Cloudflare Access pages

    Customize Cloudflare Access login, denial, and CLI pages with HTML and Liquid, and tell a blocked visitor what to do next.

  • AbduzeedoMulti Author Blogsread at source

    The Web Design of Assembly Coffee London

    Assembly Coffee London pairs high-contrast ID00 Serif type and dark-mode e-commerce layouts in a sharp web design for the Brixton roaster. Most specialty coffee stores online lean on the same tired pl...

  • CSS-TricksThe Giantsread at source

    The Frankenstein Table

    A super scary way to go about tables using other layout techniques, like CSS Grid. The Frankenstein Table originally handwritten and published with love on CSS-Tricks . You should really get the newsletter as well.

  • AbduzeedoMulti Author Blogsread at source

    Oslo Tennisklubb: Brand Identity by Garcy Studio

    Oslo Tennisklubb by Garcy Studio is a brand identity uniting 125 years of tennis heritage with expressive typography and web design. Oslo Tennisklubb has been part of the city since 1900. Garcy Studio...

  • AbduzeedoMulti Author Blogsread at source

    Ismael Branco Crafts Relentlessly Brand Identity

    Ismael Branco creates a bold brand identity, overline typography system, and landing page for Norwegian startup community Relentlessly. Two weeks isn't much time to build a visual world from scratch. ...

  • AbduzeedoMulti Author Blogsread at source

    Typography: Gregory Grotesk by Jakob Runge & TypeMates

    Jakob Runge and German foundry TypeMates craft Gregory Grotesk, a 24-style typography family shaped by wood-type soft anti-ink traps. Work paralysis sparked this whole family. Staring down the massive...

  • HeyDesignerDeveloper/Designer Newsread at source

    Building beautiful websites with Claude (video)

    Designing a skill, Building an AI-ready design system library, How I design with AI, part 2, HTML-in-Canvas in Chrome 157.

  • DigitalOcean BlogMulti Author Blogs17 min read

    Inside DigitalOcean Simulations: how user simulation, execution, and validation work

    Ask a coding agent which Python version to upgrade to from 3.11, and it picks one from memory. It cites a few changes from that version’s release notes and calls the upgrade straightforward. A single-turn evaluation asking “Is this a reasonable recommendation?” would likely pass…

  • PiccalilliMore Front-end Bloggersread at source

    If we stop, we lose

    It's been a rather morale draining era in the making websites industry since the wider tech industry decided to gamble everything on LLMs. We at Piccalilli see it amongst the community and feel it ourselves. You'll also have noticed the velocity of posts has slowed down somewhat on this website with no new courses announced either. There's a couple of reasons for that. First, the numbers have taken a dramatic tumble — industry-wide — but also, aside from being very busy in the studio , we've been tired . Swimming against this particular current will do that, even for folks like us that have always operated like that. Something else you might have noticed is that a lot of other educators have gone a lot quieter this year too. I'm writing this post today to hopefully try and fix that. A shot in the arm I had a delightful conversation with CSS-Tricks head honcho, Geoff , yesterday. Aside from the excellent vibes as a result of CSS-Tricks being back as an independent publisher , I started in a rather glum mood. After spending a few minutes listening to Geoff's exciting plans though I really perked up. We're nowhere near CSS-Tricks here, but we've always looked up to them as an example of what years and years at the top of your game looks like. Sure, the DigitalOcean acquisition didn't work out, but the fact that the publication is not only back, but well up for the fight against the supposed death of web education is really inspiring to me. I needed that win, as did many others . I needed it so much, it's spurred me on to write this article to hopefully give us all a shot in the arm. There is no inevitable future and education will always matter A comment I see all the time is "we don't need articles and courses because we can just ask an LLM now", which I guess is true, but I could also eat an entire can of spray cheese. It ain't gonna nourish me! AI technologies have given anyone the ability to bring their ideas to life, but to produce a high quality end product that actually works for the people it needs to work for requires experience, specialist skills and creativity. That is a reality, which aside from Silicon Valley's best efforts, is why there are still working developers out there, regardless of "frontier model" power. Human developer's experience is necessary because LLM outputs still (somehow, after hundreds of billions of investment) fall short. Let me repeat that: their experience is necessary . Who inevitably contributed to that experience? Yep: educators. Let's get to work then This article is mainly addressed to fellow educators, but also to people that write on their personal blogs. You must keep going because people still need us . If we don't, we lose. The LLM era is opening up an enormous skills gap that's only going to get wider as the industry continues to pull up the ladder, eliminating entry level positions. We're needed to help people really understand how all of this stuff works , so even if they are at the behest of LLM mandates , they can produce better outputs. The technology is going nowhere — that toothpaste is long out of the tube — but how many other hype cycles have underwhelmed in the end? Spoiler, all of them The economics of the AI industry simply do not work and the technology — albeit ever-present in development — will fall into its actual place eventually, as a niche tool . With all of this in mind, we're fighting back too, so I'm opening up the guest authoring on this site again , just like Geoff is over on CSS-Tricks . I'm determined to get this website cooking again and I would love to share your words with the rest of the industry. Let's buck up our ideas and get cracking, everyone. There's lots to teach and I know we've got plenty of fight left in us. To quote our very own Mat Marquis : You and me, we’re not done until we say we’re done Don't let the bastards grind you down.

  • Flavio CopesMore Front-end Bloggersread at source

    How to use TinyFish

    Learn TinyFish with JavaScript: search the web, extract data, automate browser tasks, reuse logins, research topics, and monitor websites.

  • QuirksBlogTop Front-end Bloggersread at source

    Things AI cannot do

    Last week I did my first tests in nearly nine years. I’m planning to redo the viewport tests , and I created a new test page . I also wrote an article about meta viewports that will be published eventually. I thoroughly enjoyed myself and was surprised how easy it was for me to slip back into compatibility testing patterns. My reflexes are still there, but I only test on three mobile devices and that saves some time. Then it occurred to me that, while AI can write my article if I give it notes, it cannot do fundamental browser compatibility research. That’s it. That’s the entire blog post.

  • SitePointThe Giantsread at source

    How to Create an App in ChatGPT in 2026

    null Continue reading How to Create an App in ChatGPT in 2026 on SitePoint .

  • SitePointThe Giantsread at source

    Testing JSON-LD Like an API: 7 Checks Before Your Next Release

    null Continue reading Testing JSON-LD Like an API: 7 Checks Before Your Next Release on SitePoint .

  • SitePointThe Giantsread at source

    AI Testing Tools: Benefits, Limitations, and Best Practices

    null Continue reading AI Testing Tools: Benefits, Limitations, and Best Practices on SitePoint .

  • Perishable PressMore Front-end Bloggers1 min read

    9G Firewall

    Hello! Just a quick post to let you know that the 9th version of my nG Firewall is in development. The 9G Firewall is not yet public, so if you encounter anyone claiming otherwise, they are incorrect. Unfortunately it is necessary to post this information because someone actually hijacked the name “9G Firewall” for their own project. So when people are looking for the next generation “9G” firewall, they are likely to find the counterfeit and possible confusion. Summary: 9G […]

  • SitePointThe Giantsread at source

    How to Quickly Check What Your HTML Code Looks Like in a Browser

    null Continue reading How to Quickly Check What Your HTML Code Looks Like in a Browser on SitePoint .

  • SitePointThe Giantsread at source

    How Applicant Tracking Systems Read Resumes: 7 Checks Developers Should Make

    null Continue reading How Applicant Tracking Systems Read Resumes: 7 Checks Developers Should Make on SitePoint .

  • Google for DevelopersYouTube ChannelsVideoWatch on YouTube

    🪴 Building an autonomous plant rover with Gemini Live

  • Frontend Masters BlogMore Front-end Bloggers10 min read

    Useful @custom-media Presets

    Custom media queries let you name and reuse media queries the way custom properties do for values. Here’s a set of drop-in @custom-media presets for input mechanisms, breakpoints, and true HDR, plus a container style query version of each that works in every browser today.

  • remy sharp's b:logTop Front-end Bloggers2 min read

    My 2027 Web Platform Feature Ranking [blog]

    Like my peers, I've decided to publish my personal ranking preference for the 2027 interop project. I'm doing this from a phone, so I can't link to the others that have published theirs, but I think it's interesting to see and compare what we feel is important.

  • Twilio BlogMulti Author Blogsread at source

    Brilliant Builds: Building for Loyalty

    On Brilliant Builds episode 1, we dive deep into how businesses can actually make sense of fragmented customer data to deliver true customer recognition.

  • Twilio BlogMulti Author Blogsread at source

    Brilliant Builds: Building for Seamlessness

    In Episode 3, we sit down with Matthew Blakemore—AI Leadership & AI Strategy Lecturer and key contributor to the EU AI Office's General-Purpose AI Code of Practice.

See everything from the last 30 days →