Best of JavaScript — December 2024

  1. 1
    Article
    Avatar of devtoDEV·1y

    100+ Frontend Projects to level up your Skills

    Finding interesting frontend projects to work on can be challenging for both beginners and experienced developers. This post shares a GitHub repository with over 100 frontend projects, complete with source code. The projects range from beginner to advanced levels, covering a variety of applications like calculators, e-commerce websites, and more. Tips on how to select, analyze, and customize these projects are also provided to help developers improve their skills and build an impressive portfolio.

  2. 2
    Article
    Avatar of fullstackdeveloperFullstack Developer·1y

    React animated library

    React Bits is an open-source library by David Haz designed for React.js. It offers a variety of animated components and snippets, including text and container animations and components like Stack, Dock, and Masonry. This library aims to simplify the implementation of animations in React projects.

  3. 3
    Article
    Avatar of webtoolsweeklyWeb Tools Weekly·1y

    Top Tools of 2024 (Part 1)

    HubSpot is recommended as the top free CRM software for small and scaling businesses, offering powerful features and an intuitive user experience. The post lists tools ranked #60 to #31 for 2024, including libraries like remoteStorage for data persistence, CodeViz for visualizing codebases, and matcha.css for simple styling. Readers are encouraged to support the newsletter through subscriptions or contributions.

  4. 4
    Article
    Avatar of lonely_programmerLonely Programmer·1y

    Language Stats

  5. 5
    Article
    Avatar of devtoDEV·1y

    My 2024 Good Links List

    A comprehensive list of useful links categorized by developer tools, design and UX resources, analytics, AI, workflow, e-commerce, inspiration, web3, and other miscellaneous topics. The list includes platforms like Supabase, Tailwind UI, Vercel AI SDK, Mixpanel, Monday.com, Thirdweb, and more, offering a wide range of solutions for various development and design needs.

  6. 6
    Article
    Avatar of infoworldInfoWorld·1y

    Just say no to JavaScript

    JavaScript, created in a week in 1995, has become the most common programming language despite its numerous pitfalls. The author argues for TypeScript as a superior alternative due to its expressive and powerful type system, which enhances code clarity and maintainability. The post rebuts common objections to TypeScript and advocates for its gradual adoption.

  7. 7
    Article
    Avatar of communityCommunity Picks·1y

    Lightweight Charts™ library — TradingView

    TradingView's Lightweight Charts library offers a compact, feature-rich solution for interactive, high-performance charts. At just 45 KB, it uses HTML5 Canvas technology and supports streaming updates for custom data. The library is open-source, developer-friendly, and accessible, and is trusted by millions of traders and companies. It provides an easy-to-integrate charting solution with flexible styling options and is designed to be responsive and mobile-friendly.

  8. 8
    Article
    Avatar of nuxtandvueVuejs&Nuxtjs·1y

    Library Tier List from the State of JS 2024

  9. 9
    Article
    Avatar of newstackThe New Stack·1y

    5 JavaScript Libraries You Should Say Goodbye to in 2025

    As JavaScript continues to evolve, some older libraries like jQuery, Moment.js, Lodash, Underscore, and RequireJS are becoming obsolete. Modern frameworks, native JavaScript features, and better alternatives such as ES6+ syntax, date-fns, and modern bundlers can significantly improve performance, reduce bundle sizes, and make your code more maintainable. It’s time to update your projects and embrace these newer technologies by 2025.

  10. 10
    Article
    Avatar of astro_sourceAstro·1y

    Astro 5.0

    Astro 5.0 introduces powerful features like the Astro Content Layer, which offers a unified, type-safe API for fetching and managing content from various sources. Additionally, Server Islands allow for a mix of static and dynamic content on the same page to optimize performance. Other highlights include simplified prerendering, type-safe environment variables with `astro:env`, integration with Vite 6, and several experimental features such as image cropping, responsive image layouts, and SVG component support. The update aims to make content-driven site building more efficient and flexible.

  11. 11
    Article
    Avatar of communityCommunity Picks·1y

    Creating a Secure Node.js REST API

    Explore how to create a secure REST API in Node.js with detailed instructions on setting up the back end using Node.js, Express.js, and Mongoose. Learn about the essential CRUD operations, user authentication with JSON web tokens, and security best practices to protect your API.

  12. 12
    Article
    Avatar of devtoDEV·1y

    5 Frontend Development Myths That Need to Die in 2024

    Frontend development is often misunderstood due to persistent myths. Common misconceptions include the simplicity of CSS, the ability of frameworks to solve all problems, the perceived complexity gap between frontend and backend, the optional nature of accessibility, and the belief that frontend development will soon be fully automated by AI. These myths overlook the nuanced, challenging nature of building user-facing software and highlight the importance of understanding the intricacies of frontend work.

  13. 13
    Video
    Avatar of joshuamoronyJoshua Morony·1y

    WEB WORKERS made my code over 100x faster (almost ZERO blocking time)

    Using web workers in Angular with Phaser can drastically improve performance by offloading computationally expensive tasks like the wave function collapse algorithm from the main thread. This allows the game to render terrain without causing freezing or requiring loading screens. Web workers handle the heavy computations and communicate results back to the main thread, ensuring smooth gameplay and responsive UI.

  14. 14
    Article
    Avatar of syncfusionSyncfusion·1y

    Svelte vs React: Which Framework to Choose?

    In 2025, the choice between Svelte and React remains crucial for frontend developers focused on performance, user experience, and scalable app development. While React, a mature library with a vast ecosystem, is optimal for large-scale, complex applications, Svelte offers a lightweight and performance-optimized alternative suitable for small to medium-sized projects. This comparison highlights their key differences in performance, developer experience, and architecture to help developers choose the most appropriate framework based on project needs.

  15. 15
    Video
    Avatar of bytegradByteGrad·1y

    Next.js Top 7 Security Best Practices (Checklist)

    Ensure the security of your Next.js applications by following a comprehensive checklist that includes dependency management, data validation, and setting up content security policies. Learn how to use tools like arcjet to protect against common vulnerabilities and automate security checks efficiently.

  16. 16
    Article
    Avatar of tigerabrodiTiger's Place·1y

    I misunderstood Promise.all in JavaScript

    The post clarifies the common misconception about `Promise.all` in JavaScript, which waits for multiple promises to resolve and returns their results in an array. It explains how `await` works as syntactic sugar and how `Promise.allSettled` provides a way to handle all promises' results, including rejections, for better debugging. Practical examples demonstrate how to use these methods effectively.

  17. 17
    Article
    Avatar of devtoDEV·1y

    Tracking down high memory usage in Node.js

    The post discusses a developer's approach to tracking and fixing high memory usage in Node.js applications. It covers understanding the code, replicating the issue, capturing memory profiles from staging services, and verifying the fix. The result was a significant reduction in memory usage and better service reliability.

  18. 18
    Article
    Avatar of tkdodoTkDodo·1y

    React Query - The Bad Parts

    The talk discusses the tradeoffs of using React Query, addressing common misconceptions such as its bundle size and the complexity of its API. While React Query is highly regarded for its developer and user experience, it has its limitations, such as not supporting normalized caching. The talk emphasizes understanding these tradeoffs and choosing the right tool for the job, rather than using React Query for all state management tasks.

  19. 19
    Article
    Avatar of devtoDEV·1y

    React 19 Finally Stable, New Rust-Based JavaScript Framework, New Developer Tools, and more

    React 19 is now stable with new async features, including 'useTransition' and 'useOptimistic' hooks for smoother loading and responsive states. Boa v0.20, a Rust-based JavaScript engine, boosts ECMAScript compliance to 90% and includes new features like Atomics.pause for optimized multi-threaded tasks. Safari 18.2 introduces developer-friendly updates such as cross-document view transitions, Float16Array, and enhanced WebAssembly support with garbage collection. Additional tools like Redux Toolkit 2.5, Termo, Civet and Rockpack provide enhancements for smoother development workflows.

  20. 20
    Article
    Avatar of hnHacker News·1y

    boardgameio/boardgame.io: State Management and Multiplayer Networking for Turn-Based Games

    boardgame.io is a JavaScript engine for developing turn-based games. It handles state management, multiplayer synchronization, and AI bots automatically, making it easy to create and manage game state without writing networking or storage code. Features include game phases, a lobby for matchmaking, prototyping tools, and extendable plugins. It supports vanilla JS and React/React Native. The community offers documentation, examples, and support for contributors.

  21. 21
    Article
    Avatar of freecodecampfreeCodeCamp·1y

    How to Build a Reusable Keyboard Shortcut Listener Component in React

    Learn how to build a reusable keyboard shortcut listener component in React using Tailwind CSS and Framer Motion. This component can enhance the user experience by efficiently handling keyboard shortcuts, providing a cleaner codebase, and improving accessibility. The guide includes code snippets, setup instructions, and tips for adding animations and optimizing for accessibility.

  22. 22
    Video
    Avatar of t3dotggTheo - t3․gg·1y

    I might have a new favorite state manager...

    Introducing xstate store, a new state management tool that offers a modern, lightweight approach combining the best features from libraries like zustand and Redux toolkit. It excels in type inference, separation of context and transitions, and provides an upgrade path from simple stores to more complex state machines. xstate store is also framework-agnostic, which simplifies logic separation from the UI layer.

  23. 23
    Video
    Avatar of awesome-codingAwesome·1y

    Now is The Best Time to Learn React Native

    React Native recently underwent a significant architecture rework, enhancing its performance and making it an even better option for building native apps using JavaScript. The improved architecture includes a direct synchronous link between JavaScript and native code, removing previous performance bottlenecks. React Native allows developers to use a single codebase for cross-platform development, translating React components into native equivalents for a seamless user experience. The updated system includes a new module system, synchronous and asynchronous layout reading, and more responsive UIs.

  24. 24
    Article
    Avatar of communityCommunity Picks·1y

    How React Compiler Performs on Real Code

    React Compiler, a tool developed by the React core team, aims to improve app performance by handling memoization automatically. It can reduce the number of re-renders without the need for `useMemo` and `useCallback` hooks. This investigation measured its impact on both initial load performance and interaction performance, finding mostly positive results with minimal initial load impact and noticeable interaction improvements. It can’t catch all re-renders, but it could be 'good enough' for many apps. Advanced performance optimization may still require manual memoization.

  25. 25
    Article
    Avatar of simonwillisonSimon Willison·1y

    Prompts.js

    A new JavaScript library, Prompts.js, offers an await-based alternative to the browser's built-in alert, confirm, and prompt functions. It leverages the o1 model from OpenAI for rapid code prototyping, allowing for smoother and more customizable modal dialogs. The library is available on npm and through CDNs like jsDelivr. Recent updates improved accessibility by integrating the browser's dialog.showModal() method.

See all JavaScript archives