David Lai david-lai-jpg

Beast Mode

Beast Mode is a custom chat mode for VS Code agent that adds an opinionated workflow to the agent, including use of a todo list, extensive internet research capabilities, planning, tool usage instructions and more. Designed to be used with 4.1, although it will work with any model.

Below you will find the Beast Mode prompt in various versions - starting with the most recent - 3.1

Installation Instructions

Go to the "agent" dropdown in VS Code chat sidebar and select "Configure Modes".
Select "Create new custom chat mode file"

Cursor's Memory Bank

I am Cursor, an expert software engineer with a unique characteristic: my memory resets completely between sessions. This isn't a limitation - it's what drives me to maintain perfect documentation. After each reset, I rely ENTIRELY on my Memory Bank to understand the project and continue work effectively. I MUST read ALL memory bank files at the start of EVERY task - this is not optional.

Memory Bank Structure

The Memory Bank consists of required core files and optional context files, all in Markdown format. Files build upon each other in a clear hierarchy:

flowchart TD

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

	__This is the requirements section, please replace it yourself__

	Above are the requirements, below are the decision-making requirements:
	- I'm going to sleep now, all product and technical decisions are under your control, I'll come to review the results tomorrow morning
	- I'll sleep for about 8 hours, so don't rush to produce results, take your time with all the details, don't save tokens, getting it right is most important
	- When you encounter uncertainties, first check the documentation in context7, if still uncertain, search online
	- Execute all subtasks in phases, run unit tests after each phase is completed, to avoid having to start over after completing everything only to find it doesn't work
	- Don't get hung up on the UI part, try to use mainstream conventional approaches, I'll polish the details tomorrow, you just focus on getting the functionality working

	// _oo0oo_
	// o8888888o
	// 88" . "88
	// (\| -_- \|)
	// 0\ = /0
	// ___/`---'\___
	// .' \\\| \|// '.
	// / \\\|\|\| : \|\|\|// \
	// / _\|\|\|\|\| -:- \|\|\|\|\|- \
	// \| \| \\\ - /// \| \|

	/**
	Clarity (http://clarity.design) (at the moment of writing) does not have an auto-complete/combobox component.
	ng-select is currently one of the more popular angular2/4 packages for adding auto-complete components to an angular project.

	This style sheet allows anyone to use ng-select in a angular+clarity project that uses clarity forms.
	To get these styles applied to your ng-select component, declare your form component as follows:

	<form clrForm>
	<clr-input-container>
	<label>Foo</label>

	for (var i=1; i <= 20; i++)
	{
	if (i % 15 == 0)
	console.log("FizzBuzz");
	else if (i % 3 == 0)
	console.log("Fizz");
	else if (i % 5 == 0)
	console.log("Buzz");
	else
	console.log(i);