Programming News Today: TypeScript 7.0 Goes Native & Vite 8 Switches to Rust – July 16, 2026

npm install -D typescript   # 7.0 ships a native tsc
npx tsc --noEmit            # same flags, ~10x faster type checking

npm create vite@latest my-app
# Vite 8 uses Rolldown under the hood — no config change for most apps

<button command="show-modal" commandfor="dlg">Open</button>
<dialog id="dlg">
  <button command="close" commandfor="dlg">Close</button>
</dialog>

import Link from "next/link"
<Link href="/dashboard" prefetch>Dashboard</Link>

.card { container-name: card; }
@container card style(--variant: danger) {
  .title { color: crimson; }
}

# eslint-plugin-react-hooks v6: flat config + compiler-powered rules
npm i -D eslint-plugin-react-hooks@6

<div class="pbs-4 mbe-2 inset-s-0 bg-mauve-100">Logical spacing</div>

SELECT uuidv7();               -- time-ordered UUIDs, better index locality
SET io_method = 'io_uring';    -- opt into async I/O on Linux

<button command="toggle-popover" commandfor="menu">Menu</button>
<div id="menu" popover>...</div>

<dialog id="d" closedby="any">Click outside or press Esc to close</dialog>

<button popovertarget="tip">?</button>
<div id="tip" popover="hint">Extra info</div>

@container style(--theme: dark) { a { color: #8ab4f8; } }

dialog:open { animation: fade-in .2s; }
details:open summary { font-weight: 700; }

.trigger { anchor-name: --btn; }
.tooltip { position: absolute; position-anchor: --btn; top: anchor(bottom); }

Math.sumPrecise([0.1, 0.2, 0.3]); // 0.6 exactly

try { risky(); } catch (e) {
  if (Error.isError(e)) console.log(e.stack);
}

const counts = new Map();
counts.set(k, counts.getOrInsert(k, 0) + 1);

npm install -D typescript
npx tsc --noEmit   # native speed

{ "compilerOptions": { "target": "ES2020", "types": [] } }

npm install -D typescript@6   # keep 6.0 while validating 7.0

<Activity mode={tab === 'a' ? 'visible' : 'hidden'}>
  <PanelA />
</Activity>

const onConnected = useEffectEvent(() => showToast(theme));

npx shadcn@latest init          # Base UI by default
npx shadcn@latest init -b radix # opt back into Radix

npx shadcn@latest add message bubble message-scroller

npx shadcn@latest add button

<div class="mbs-4 pbe-2 bg-taupe-200">Writing-mode aware</div>

<div class="overflow-auto scrollbar-thin scrollbar-thumb-slate-400">...</div>

<h1 class="text-shadow-lg mask-b-from-50%">Masked heading</h1>

.btn-custom { color: color-contrast($brand); }

<div class="spinner-border" role="status"></div>

npm i bootstrap@5.3.8   # current; watch for 5.4.0

node --experimental-import-text app.js

import { isUtf8 } from 'node:buffer';
isUtf8(Buffer.from('h\u00e9llo')); // true, fast path

node -v   # v26.5.0

https://expressjs.com/llms.txt   # docs for LLMs/agents

app.get("/u/:id", async (req, res) => {
  const u = await db.user(req.params.id); // throw auto-forwards
  res.json(u);
});

app.get("/files/*splat", handler); // v5 wildcard syntax

SHOW VARIABLES LIKE 'innodb_log_writer_threads';

mysql --version   # target 8.4 LTS for long-term support

SET GLOBAL authentication_ldap_sasl_auth_method_name = 'SCRAM-SHA-256';

<Link href="/reports" prefetch>Reports</Link>

const pages = import.meta.glob('./content/*.md'); // Vite-compatible glob

npm i next@latest   # pin and watch the security channel

<script setup vapor>
import { ref } from "vue"
const count = ref(0)
</script>

SELECT uuidv7();
SET io_method = 'io_uring';

enum Role { USER ADMIN }

model User {
  id   Int  @id @default(autoincrement())
  role Role @default(USER)
}

import { drizzle } from "drizzle-orm/node-postgres"
const db = drizzle(process.env.DATABASE_URL)
const rows = await db.select().from(users)

import sys
print(sys.version_info)  # 3.14.6

HttpClient client = HttpClient.newBuilder()
    .version(HttpClient.Version.HTTP_3)
    .build();