Hasty Briefsbeta

All tags

#web development

328 stories total

Bilingual

Is it still worth using jQuery in 2025?
10 months ago
- jQuery was revolutionary in 2006 by simplifying DOM manipulation, cross-browser compatibility, and offering utilities like AJAX and animations.
- Modern JavaScript now includes features like `querySelector`, `fetch`, and `classList`, reducing the need for jQuery.
- jQuery remains prevalent in 2025 (~74% of websites) due to legacy systems, CMS dependencies, and developer familiarity.
- For new projects, vanilla JS or frameworks like React/Vue are preferred for scalability, performance, and future-proofing.
- jQuery is still useful for quick fixes, legacy maintenance, or when specific plugins are required.
Astro is a return to the fundamentals of the web
10 months ago
- Astro is a web framework designed for content-focused websites, launched in 2021.
- It follows a server-first, content-driven philosophy, shipping zero JavaScript by default.
- Introduces 'Island Architecture' where only interactive parts of a page use JavaScript, keeping the rest as static HTML for better performance.
- Astro sites are significantly faster, with up to 40% faster load times compared to traditional React frameworks.
- Offers a straightforward developer experience with easy project setup and excellent tooling.
- Components in Astro run at build time, simplifying data fetching and logic without complex state management.
- Supports multiple frameworks (React, Vue, etc.) or none, allowing flexibility in development.
- Features built-in Markdown support, TypeScript, Sass compilation, and automatic image optimization.
- Ideal for marketing sites, blogs, e-commerce, and portfolios where content is key.
- Not suited for complex SPAs or heavy client-side state management; better alternatives exist for those needs.
- Quick to start with simple commands and a clear project structure.
- Astro emphasizes fast, accessible, content-first web experiences with modern developer conveniences.
Modern Node.js Patterns for 2025
10 months ago
- Modern Node.js embraces web standards, reduces dependencies, and improves developer experience.
- ES Modules (ESM) replace CommonJS, offering better tooling and alignment with web standards.
- Top-level await simplifies initialization, eliminating the need for async wrapper functions.
- Built-in Web APIs like Fetch and AbortController reduce the need for external libraries.
- Node.js includes a built-in test runner, eliminating dependencies on frameworks like Jest or Mocha.
- Sophisticated async patterns with enhanced error handling and parallel execution improve performance.
- Modern event handling with AsyncIterators provides better control over streams of events.
- Advanced streams integrate with Web Streams for better interoperability across environments.
- Worker threads enable true parallelism for CPU-intensive tasks without blocking the main thread.
- Enhanced development experience with built-in watch mode and environment file support.
- Modern security features include a permission model for restricting application access.
- Built-in performance monitoring helps identify bottlenecks without external tools.
- Single executable applications simplify deployment and distribution.
- Structured error handling and diagnostics provide better debugging and monitoring.
- Import maps and dynamic imports improve package management and module resolution.
Improving AVIF in Open Source
10 months ago
- AVIF is gaining popularity for web images due to its compression and quality, but open-source encoders faced consistency and efficiency issues.
- Gianni Rosato, founder of Halide Compression, worked on improving AVIF through the SVT-AV1-PSY project, focusing on still image optimization.
- Key improvements in AVIF encoding include quantization matrix scaling, deblocking loop filter sharpness, variance-adaptive quantization, and screen content detection.
- The 'Tune Still Picture' mode in SVT-AV1-PSY introduced techniques that improved compression by up to 15% and enhanced perceptual quality.
- Modern image codecs on the Web are often derived from video standards, leading to suboptimal image encoding performance.
- Halide Compression aims to create an image-first ecosystem with efficient licensable encoders and expert consulting to address current limitations.
- Future developments like AV2 could further enhance still image performance, but challenges remain in encoder consistency and resource allocation.
Nuxt v4
10 months ago
- Nuxt 4.0 is officially released, focusing on stability and improved development experience.
- New project organization with an 'app/' directory structure for cleaner code separation.
- Enhanced data fetching with 'useAsyncData' and 'useFetch' for better performance and automatic data sharing.
- Improved TypeScript support with separate projects for app, server, shared, and builder code.
- Faster CLI and development experience with optimized cold starts, Node.js compile cache, and socket-based communication.
- Upgrade guide available to help transition from Nuxt 3 to Nuxt 4 with minimal effort.
- Future plans include Nuxt 5 with Nitro v3 and h3 v2 for better performance and more features.
- Thank you to the community for testing and contributing to Nuxt 4's development.
Gmail/Google starts disabling features unless you agree to data processing
10 months ago
- The web application requires JavaScript for full interactivity.
- Simple HTML interfaces are possible but not utilized here.
- Victor Bjelkholm criticizes a service's data usage policy, highlighting a forced choice between data processing or losing existing features.
Cookies Having Independent Partitioned State (Chips)
10 months ago
- CHIPS (Cookies Having Independent Partitioned State) allows developers to opt cookies into partitioned storage, preventing cross-site tracking while enabling legitimate third-party cookie uses.
- Partitioned cookies are double-keyed by the setting origin and the top-level page origin, restricting access to the context of the top-level site.
- CHIPS introduces a 'Partitioned' attribute for the Set-Cookie header, requiring cookies to be set with 'Secure' and optionally using the '__Host' prefix for domain binding.
- The mechanism uses two keys for storage: the host key and a partition key based on the top-level URL's scheme and eTLD+1, ensuring cookies are only accessible under matching partition keys.
- CHIPS supports legitimate uses like persisting state across subdomains (e.g., chat widgets) while blocking unauthorized cross-site tracking.
- It differs from Firefox's state partitioning by allowing opt-in to third-party cookies for non-tracking purposes.
- Compatibility and specifications are detailed, with references to further reading on the Privacy Sandbox.
This month in Servo: network inspector, a11y first steps, WebDriver, and more
10 months ago
- Servo had its busiest month in years with 349 pull requests merged.
- New features include viewport meta tags, exportparts attribute, '::part()' selector, and various web API enhancements.
- Support for screen readers in servoshell’s browser UI was added, though webviews remain inaccessible.
- CanvasRenderingContext2D and CanvasPattern now support setTransform() with a dictionary.
- Improved abort handling with AbortController and AbortSignal functionalities.
- Experimental multiprocess mode now works on Windows.
- Bug fixes, including HTML form submission encoding in non-Unicode documents, fixing 97000+ subtests.
- Outreachy intern Jerens Lensun is improving linting in mach.
- Devtools enhancements include basic Network tab support and compatibility with Firefox 139.
- Performance improvements in incremental layout and script queries optimization.
- WebDriver server development progresses with better context switching, input sending, and page inspection.
- Servo received $4464/month in donations, supporting CI runners and Outreachy interns.
- Servo is on thanks.dev, with 25 GitHub users sponsoring.
Simulating Hand-Drawn Motion with SVG Filters
10 months ago
- The article discusses the 'boiling' or line boil effect, a common animation technique that simulates hand-drawn motion by introducing slight variations in position and rotation.
- The effect is traditionally achieved by drawing the same frame multiple times with subtle differences, but the article explores a digital approach using SVG filters and JavaScript.
- Two main components of the effect are identified: distorting the edges of shapes to mimic hand-drawn imperfections and animating these distortions over time.
- SVG filter effects, specifically feTurbulence and feDisplacementMap, are used to create procedural noise that distorts the edges of shapes, simulating the boiling effect.
- JavaScript is employed to animate the filter parameters, such as baseFrequency and displacement scale, at regular intervals to create dynamic motion.
- Interactive demos are provided to illustrate how adjusting parameters like animation scale can control the intensity of the wobble effect.
- The article concludes by emphasizing the simplicity and effectiveness of using SVG filters and JavaScript to bring static illustrations to life with hand-drawn motion effects.
Why you should choose HTMX for your next web-based side project (2024)
10 months ago
- HTMX allows building modern web apps faster and cheaper by extending HTML for partial page reloads.
- Multi-Page Apps (MPA) are simple but feel slow due to full page reloads.
- Single-Page Apps (SPA) offer rich user experiences but are complex to build and scale.
- HTMX bridges the gap between MPAs and SPAs, offering modern experiences with MPA simplicity.
- For side projects, HTMX reduces development time and cost, making it ideal for solo developers.
- The HAM Stack, incorporating HTMX, is recommended for efficient and cost-effective web app development.
A Friendly Introduction to SVG
9 months ago
- SVGs (Scalable Vector Graphics) are an image format that uses XML syntax, allowing them to be manipulated with CSS and JavaScript.
- Inline SVGs can be directly embedded in HTML, making them dynamic and interactive.
- SVG shapes include <circle>, <rect>, <line>, <polygon>, and <ellipse>, each with unique attributes for customization.
- The viewBox attribute in SVGs defines an internal coordinate system, enabling scalable and responsive designs.
- SVG strokes can be styled with properties like stroke-width, stroke-dasharray, and stroke-linecap, and animated using CSS.
- Animating stroke-dashoffset can create effects like self-drawing SVGs or animated spinners.
- SVGs are powerful for creating dynamic, scalable, and interactive illustrations in web development.
Tailwind Is the Worst of All Worlds
9 months ago
- Tailwind is criticized for combining the worst aspects of CSS and modern web development.
- CSS has evolved with features like flexbox and grid but retains issues like specificity conflicts.
- Inline styles and stylesheets are CSS's two main methods, each with pros and cons.
- Tailwind replaces inline styles with classes, leading to readability and maintainability issues.
- Tailwind lacks solutions for CSS's inherent problems, like specificity conflicts, and exacerbates them.
- Tailwind requires a bundler, increasing JavaScript bundle sizes and slowing down apps.
- Developer experience with Tailwind is poor due to lack of type safety and constant need for reference.
- Tailwind's success is attributed to its enforced global constants, reducing inconsistency in large teams.
- Alternatives like vanilla-extract offer better solutions but require more setup and discipline.
- The article concludes that Tailwind represents the worst of all worlds in web styling solutions.
Celebrating 20 Years of MDN
9 months ago
- MDN celebrates its 20th anniversary, marking two decades of supporting web developers.
- Started as a community-driven wiki, MDN has grown to include nearly 14,000 pages of documentation and over 33,000 localized articles.
- MDN is a trusted resource with compatibility data on close to 18,000 web features.
- The tradition of sending cakes among browser makers symbolizes collaboration in the web community.
- MDN thanks its global community, including over 100,000 contributors, for their passion and contributions.
- The web.dev team sent a birthday cake to celebrate MDN's anniversary.
- MDN invites developers to share their experiences and join in contributing to web platform documentation.
Vanilla JavaScript support for Tailwind Plus
9 months ago
- Tailwind Plus UI blocks now fully functional without requiring JavaScript frameworks.
- Introduction of @tailwindplus/elements library for Tailwind Plus customers, enabling interactive UIs with just HTML.
- Custom elements like <el-dropdown> and <el-select> provide complex UI behaviors without custom JavaScript.
- Support for modern web features like popover attribute, <dialog> elements, and ElementInternals for form controls.
- Elements library works across frameworks (Svelte, Rails, React) and includes necessary polyfills for broad compatibility.
- First release includes primitives for Autocomplete, Command Palette, Dialog, Disclosure, Dropdown, Popover, Select, and Tabs.
- Examples provided for integrating Elements in various frameworks, demonstrating two-way binding and form submissions.
- Available now to Tailwind Plus customers with updated UI blocks and comprehensive documentation.
How I fixed my blog's performance issues by writing a new Jekyll plugin
9 months ago
- Author discovered Google wasn't indexing their blog posts due to poor performance.
- Google PageSpeed Insights revealed a low score of 43/100, highlighting issues with Google Fonts, YouTube embeds, and image delivery.
- Self-hosted fonts by manually downloading and embedding CSS and WOFF2 files, removing unused font faces.
- Replaced YouTube's default embed code with a third-party library (lite-youtube) for better performance.
- Optimized images by offering multiple formats (AVIF, WebP), responsive sizes (srcset), and lazy loading.
- Created a new Jekyll plugin, jekyll-skyhook, to handle image transformations, responsive images, cache-busting, and CSS URL rewriting.
- The plugin integrates modern JavaScript build tools (esbuild, Tailwind) and avoids outdated Ruby asset pipelines.
- Implemented a development workflow with npm scripts for CSS/JS processing and Foreman for local development.
- Used a responsive-image helper include to automate optimal image delivery in blog posts.
- PageSpeed score improved dramatically to 99/100 after optimizations.
How to Make Websites That Will Require Lots of Your Time and Energy
9 months ago
- Install dependencies indiscriminately from npm to become dependent on others, leading to time-consuming replacements when they break.
- Choose a framework before understanding if it's needed, requiring updates and learning framework changes, consuming more time and energy.
- Implement a complex compilation step between coding and viewing the website, adding unnecessary time and effort to the development process.
Three HTTP versions later, forms are still a mess
9 months ago
- The author is working on adding an HTTP 1.1 stack to Inko's standard library, including server, client, cookie handling, form parsing, and a request router.
- HTTP 1.1 is described as messy and organically grown, with RFCs acting more like reference documents than specifications.
- The protocol includes odd choices like hexadecimal chunk sizes in chunked transfers and mandatory spaces in response lines.
- Form handling in HTTP is particularly messy, with two 'standard' encodings: application/x-www-form-urlencoded and multipart/form-data.
- application/x-www-form-urlencoded lacks clear specifications, leading to inconsistent implementations and encoding issues.
- multipart/form-data is based on email formats, uses random boundary separators, and is bloated and difficult to parse efficiently.
- There's no good alternative for forms mixing files and non-files, with proposals like JSON for forms or XForms not gaining traction.
- The author expresses frustration with the lack of progress in form handling despite newer HTTP versions.
Structuring large Clojure codebases with Biff
9 months ago
- Jacob O'Bryant is rewriting Yakread, a reading app, from scratch and open-sourcing it.
- He is experimenting with new features for Biff, a Clojure web framework, to manage larger codebases.
- Old Yakread had slow queries, like taking over 10 seconds to load subscription data.
- Traditional denormalization was avoided by implementing materialized views for XTDB, stored in RocksDB.
- Materialized views use pure 'denormalizer' functions to update data incrementally.
- Testing is simplified with property-based testing and oracle functions to verify materialized views.
- All application code in 'New Yakread' is pure, with no mocks needed in unit tests.
- Functions are structured as state machines, separating pure logic from effect handlers.
- Effect handlers are centralized and kept simple, improving testability and observability.
- Unit tests compare function outputs against saved EDN files, making testing more convenient.
- The codebase uses Pathom resolvers to separate model and view code, similar to OOP but with pure data.
- Pathom resolvers handle database queries, derived data, and even UI fragments, keeping code modular.
- GET request handlers define Pathom queries, simplifying backend logic and improving clarity.
- The approach is similar to Fulcro but tailored for server-side rendering with htmx.
- Yakread's rewrite is ongoing, with plans to integrate successful experiments into Biff.
State of HTML 2025
9 months ago
- The first State of HTML survey in 2023, led by Lea Verou, broke records with 21,000 respondents.
- HTML now includes dynamic APIs, performance hints, templating, and more, beyond just tags and attributes.
- In 2025, the survey added 35 new features and introduced two new sections: Graphics & Multimedia and Performance.
- Survey results influence browser vendors' roadmaps, helping shape the future of the web.
- The survey takes 10-15 minutes to complete and is open to anyone involved in web development.
- Goals include measuring awareness of new HTML features and tracking usage evolution.
- Data is openly released and used by developers and browser vendors.
- The survey runs from July 15 to August 15, 2025, with results released around September 15, 2025.
- Organized by Devographics with contributions from browser vendors and the web development community.
Show HN: Astro dev blog template with 60 interactive colorschemes
9 months ago
- The blog showcases the custom Astro theme/template MultiTerm.
- Features include an interactive theme changer, RSS, sitemap, tagging, and markdown extensions.
- Topics covered include Python's context managers and the with statement.
- TypeScript's keyof operator and mapped types for advanced type manipulation.
- JavaScript's prototypal inheritance and its use cases.
- Go's use of interfaces to achieve polymorphism.

first prev5next

About|Login

#web development

Is it still worth using jQuery in 2025?

Astro is a return to the fundamentals of the web

Modern Node.js Patterns for 2025

Improving AVIF in Open Source

Nuxt v4

Gmail/Google starts disabling features unless you agree to data processing

Cookies Having Independent Partitioned State (Chips)

This month in Servo: network inspector, a11y first steps, WebDriver, and more

Simulating Hand-Drawn Motion with SVG Filters

Why you should choose HTMX for your next web-based side project (2024)

A Friendly Introduction to SVG

Tailwind Is the Worst of All Worlds

Celebrating 20 Years of MDN

Vanilla JavaScript support for Tailwind Plus

How I fixed my blog's performance issues by writing a new Jekyll plugin

How to Make Websites That Will Require Lots of Your Time and Energy

Three HTTP versions later, forms are still a mess

Structuring large Clojure codebases with Biff

State of HTML 2025

Show HN: Astro dev blog template with 60 interactive colorschemes