LangShift.dev: learning a new language by diffing it against JavaScript

The premise: understand the unknown through the known

LangShift.dev is a programming language conversion learning platform built for developers. The README describes the core idea in one line, that you understand an unknown language through a known one, and the goal is stated as making it simple and efficient to learn a new programming language.

That premise decides the shape of everything on the site. It is not a language reference and not a course in the general sense. Every lesson is anchored on JavaScript, and the topics are chosen because they are the places where a JavaScript developer's intuition breaks.

The learning objectives list makes the intent explicit. You are meant to learn a new language quickly by comparison, understand the syntax characteristics and design philosophy behind different languages, build multi-language development ability, transfer your development thinking between languages, and pick up modern tooling and practices along the way.

The design philosophy angle is the one that makes the site more than a syntax cheat sheet. A comparison of, say, garbage collection against ownership, or an event loop against goroutines, is not something a language reference will give you, because a reference has no second language to compare against.

The site is published at langshift.dev, the repository is the site source with MDX as the primary language, and the last push was on 2026-10-12. There are no tagged releases, which is normal for a documentation site.

Six complete tracks, all starting from JavaScript

The catalogue is the clearest way to see the scope. Every track is JavaScript first, and the README marks each one as complete or in development.

JavaScript to Python is complete with 13 modules, covering syntax mapping for variables, functions, classes and async programming, an ecosystem comparison of npm against pip and Node.js against Python, practical projects in web development, data processing and automation, and the advanced features of type annotations, decorators and context managers.

JavaScript to Rust is complete with 14 modules, and the module list is a good illustration of the approach. Module 3 is ownership and the memory model, module 4 is concurrency and the async model, module 5 is the type system and traits, module 6 is error handling and type safety, and the later modules cover web development, systems programming, common pitfalls, idiomatic Rust style and performance.

JavaScript to Go is complete with 14 modules, JavaScript to Kotlin with 14, JavaScript to C++ with 15, and JavaScript to C with 15. JavaScript to Swift is marked as in development, with 15 modules of which some are complete.

More tracks are listed as planned rather than available, including JavaScript to Java, Python to Rust, JavaScript to Dart and Python to TypeScript.

The pattern in the module lists is consistent enough to be predictable. Each track has a module 0 that introduces the language and the method, a module 1 for basic syntax comparison, then modules on the type system, memory and concurrency, then ecosystem and tooling, then web development, then a comprehensive practical project, then common pitfalls, then an idiomatic style module, and then advanced topics. Pitfalls and idiom modules are the ones that distinguish this from a tutorial, because they are about the code a knowledgeable reviewer would reject.

Code that runs in the browser: Pyodide, V8 and Kotlin

The interactive parts are real, and the runtime story is what makes them possible.

The platform stack lists Monaco Editor 4.7.0 together with Pyodide, and the runtime section says Python runs through Pyodide in the browser, JavaScript through the V8 engine, Kotlin through the JVM with Kotlin/JS planned, and Rust through WebAssembly as a plan. The dependency list corroborates this, with kotlin-playground in the package manifest and a python-editor component in the source tree.

The consequence is that a reader can edit and run a snippet without leaving the page, which is the difference between reading about an API and trying it.

The performance implications are real, and the repository says so. The feature list includes a built-in performance monitoring component, a virtualized editor for rendering performance when there is a lot of code, and a scrolling code demo. The components directory matches, with editor-performance-monitor.tsx, virtualized-editor.tsx, monaco-manager.tsx and scrollycoding.tsx as separate pieces, and there is a PERFORMANCE_OPTIMIZATION.md document at the root.

Running a Python interpreter in a browser tab is not free, and the monitor is the mechanism for showing the cost. For a learner, that is also a teaching point: the difference between an interpreted snippet and a compiled one is visible as latency.

The requirements for the site are correspondingly modest, since everything runs client side. Node.js 18 and later, pnpm, and a modern browser with WebAssembly support.

The comparison features, side by side

The central learning device is the side by side comparison, and it appears in two forms. The README lists a code comparison mode that displays implementations in different languages next to each other, and the feature list calls out an interactive code comparison component, whose source is interactive-code-comparison.tsx.

The second form is the scrolling code demo. The scrolling code feature is described as interactive code demonstration, and it is the technique where a page scrolls and the code is written and executed as the reader moves through it, so the explanation and the code arrive together.

The documentation stack underneath this is Fumadocs 15.6.1 with MDX, and the source content lives under content/docs with a directory per track, such as content/docs/js2py and content/docs/js2rust, each with its own README.md acting as the guide for that track.

A detail worth noting is the naming of the source directories. They are named js2py, js2rust, js2go, js2kotlin, js2cpp, js2swift and js2c, so the direction of every track is in the path. When the planned Python to Rust and Python to TypeScript tracks arrive, they will be python2rust and python2ts, and the naming convention has already decided the shape of the site.

Search is handled by Orama 3.1.1 for full text search, with the tokenizers package alongside it, which matters when the corpus is a hundred modules of prose about similar-looking syntax.

The stack and the development loop

The site is a Next.js 15.5.9 application using the App Router, with React 19.2.3, TypeScript 5.8.2, Tailwind CSS 4.0.9 and Turbopack for the build. The internationalisation covers Chinese, English and traditional Chinese, and the routing in the source tree is organised under an app/[lang] directory with home, docs and intro segments.

The local development loop is four commands, and the port is worth noting because it is not the Next.js default.

git clone https://github.com/erweixin/langshift.dev.git
cd langshift.dev
pnpm install
pnpm dev

The dev script is next dev with port 8000, and the site is then at localhost:8000.

The rest of the scripts are richer than a typical documentation site, and they are the clearest evidence of what the maintainer cares about. There is a lint script that runs next lint and then a content check script over the MDX, a type-check script running tsc with noEmit, an analyze script that sets ANALYZE and builds, and a seo-check script that builds, starts the server, sleeps, and curls the sitemap and robots.txt before killing the process.

    "lint": "next lint && node scripts/check-mdx-content.mjs",
    "type-check": "tsc --noEmit",
    "content:sync-zh-tw": "node scripts/generate-zh-tw-from-zh-cn.mjs",
    "analyze": "ANALYZE=true npm run build"

The traditional Chinese content is generated from the simplified Chinese by a script, which is a practical decision for a site maintained in Chinese and read in both scripts.

The limits: generated content, one unfinished track, an unclear licence

Three honest caveats.

The first is how the content is produced. The README states plainly that the project uses AI technology to generate the learning content, and that it is reviewed and optimised afterwards. It also recommends combining the lessons with the official documentation for the best result, and invites improvement suggestions through GitHub issues. Generated prose reviewed by a person is usable, and it is still not the same as a chapter written by someone who maintains the language, so the official documentation remains the authority on anything that matters for work.

The second is coverage. The JavaScript to Swift track is marked as under development with some modules incomplete, and four more tracks are listed as planned rather than written. The site is a comparison-first curriculum from JavaScript, so a developer whose background is Python or Java will find the anchor language is not their own.

The third is the licence, and it is a small mess. The badge in the README header says MIT, while the licence recorded for the repository is unknown. There is no licence file in the repository root listing, which contains a CLAUDE.md, a .cursorrules file, the SEO and performance documents and the source directories. For a site you plan to read that is irrelevant, and for content you plan to reuse it is a question to ask the author.

The tooling also shows a project that has been built with AI assistance in the open, since the .cursorrules file and the CLAUDE.md are part of the repository rather than hidden.

Editorial conclusion

Adopt LangShift.dev if you are a JavaScript developer picking up another language and want the concepts anchored to ones you already use, because the whole curriculum is built around that comparison and the runnable examples let you check a snippet without leaving the page. Do not treat it as a reference, since the lessons are generated with AI assistance and reviewed rather than written by the language maintainers, and the JavaScript to Swift track is still in development. Before you rely on a lesson, follow the project advice and read the same topic in the official documentation for the language you are learning.

Frequently asked questions

Official sources

1. erweixin/langshift.dev on GitHub
2. Issues
3. Project website
4. README