ospatil

Svelte5 and SvelteKit SSR, components and state management

Attempt to all clarity to the Svelte concepts using QA format with simple code snippets using Claude.

• Sveltekit SSR

  Additional resource - https://github.com/ospatil/sveltekit-dataloading

• Components and state management

ospatil

DOM Performance

• How the browser renders the document
  • Receives the data (bytes) from the server.
  • Parses and converts into tokens (<, TagName, Attribute, AttributeValue, >).
  • Turns tokens into nodes.
  • Turns nodes into the DOM tree.
• Builds CSSOM tree from the css rules.

ospatil

I have a git repo which compiles into a dist folder and generates a bunch binaries (executables). The binaries and dist folders are .gitignore-ed and hence, are not included in the repo. But I want to distribute a source + binaries snapshot zipfile. I want them to contain:

a) all the sources b) all the binaries c) the dist folder (so that they can tweak it) d) not the .git/ directory, not the hidden files like .cache or node_modules/ etc.

ospatil

{
  "name": "zod",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "type": "module",
  "scripts": {
    "init": "tsc --init",
    "start": "node --loader ts-node/esm index.ts"
  },

ospatil

VS Code
Jump to file explorer	cmd + shift + e
Open highlighted file in file explorer	cmd + down-arrow
Go back to editor	cmd + 1
Toggle between terminal and editor	ctrl + backtick
Open global search view	cmd + shift + f
Fold all	cmd + k + 0
Unfold all	cmd + k + j
Unfold current	option + cmd + [

ospatil

# extract cert from pfx file (pkcs#12 format - includes root chain with "End Entity First" chain order and private key)
# will need cert password
openssl pkcs12 -in <CERT_FILE>.pfx -nodes -nokeys -nomac -out domain.crt

# extract encrypted private key
openssl pkcs12 -in <CERT_FILE>.pfx -nocerts -out domain.enc.key

# get unencrypted private key
openssl rsa -in domain.enc.key -outform PEM -out domain.key

ospatil

/**
 * __proto__ and prototype
 * - the __proto__ property the instance's 'parent' up the prototype chain
 * - the prototype property refers what new instances of the type will have their __proto__ set to, i.e. what will be the new instance's 'parent' up the prototype chain
 */

/* Given */
function Object () {}
Object.prototype = {
  __proto__: null

ospatil

Example

Name Description

ospatil

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  // To debug ts files without compiling
  "version": "0.2.0",
  "configurations": [
    {
      "name": "ts-node",
      "type": "node",

ospatil

# Create empty branch. git switch --orphan <branch name> deletes ALL files from the working tree. We don't want that.
git checkout --orphan review
# or delete only the required files that you need to review. For example, for nats project only delete go source files.
# find . -type f -name '*.go' -not -name '*test.go' -not -path '*/vendor/*' -delete
git rm -rf . 
git commit --allow-empty -m "Create empty branch"
git push --set-upstream origin review

# Create `project` branch from `main` current state.
git switch -c project