1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
|
import $ from "jquery";
import * as JSX from './jsx';
import { Dropdown, DropdownItem, Page, GroupBox } from './components';
interface TutorialPage {
title: string,
content: HTMLElement
}
const pages: TutorialPage[ ] = [
{
title: "Choosing the right model",
content:
<span>
It would get quite wordy if we were to discuss every model in detail that we provide,
so our best suggestion is to check out our <a onclick={ () => JSX.navigate( "/models" ) }>Models</a> page.
<br />
Here, you can see the various personalities our models come with by default,
the provided tooling, as well as licensing information for each respective model!
</span>
},
{
title: "Effective chatting",
content:
<span>
Effective chatting best practices are also, as with most things, on a model-by-model basis.
However, there are some good standards to abide by when interacting with any LLM to increase effectiveness.
We'll list a few of our personally notable ones here, in no particular order:
<div style="padding: 10px 10px 0;">
<b>1) Prompting :</b> A good prompt can drastically change the output of a large language model,
effective prompts will be elaborated on in the <a onclick={ () => selectPage( pages[ 2 ] ) }>next</a> section.
<br /><br />
<b>2) Clarify :</b> As the saying "garbage in, garbage out" goes with computing, it continues here to an extraordinary extent.
One of, if not, the most effective methods of improving LLM responses is by providing and continually improving:
queries, instructions, sample code, or other data you feed into the language model that fits your current need.
<br /><br />
<b>3) Reminders :</b> LLMs, just like humans, need reminders sometimes. If you are sending large amounts of data, or
if you are having a model make many web requests, it's very likely you will leave the model's
context window. This can lead to unpredictable and unexplainable results, so do with that information
what you will.
<br /><br />
<b>4) Tooling :</b> Luckily for you, utilizing our provided <a onclick={ () => selectPage( pages[ 4 ] ) }>tooling</a> is not something that you will have to initiate.
Models equipped with tooling functionality will automatically use our provided tools to better complete your requests.
All this being said, you will have to "manage" your tooling. For web requests, as mentioned above, they can quickly
devour your avaiable context window and cause erroneous responses to occur. Notes as well, when above capacity, can
cause the same. We do provide a way to manage notes, and we can only suggest to keep web requests to a minimum.
</div>
</span>
},
{
title: "Prompting",
content:
<span>
We feel like this cannot be understated, so we will mention it again.
Each model is different, and will respond differently to the same query, prompt, image, etc.
This is what we describe as "personalities".
<br />
However, as with chatting, we can provide general advice that applies across the board.
As well, we will attach some resources below that we have used in our journey in this process.
We feel these are of good quality and dig into a low level in layman's terms to help you
understand easily.
<br />
<div style="padding: 10px 10px 0;">
<b>1) Prompt format matters :</b> As seen in the resources below, there are many types of prompting.
Using the wrong style of prompt for the wrong purpose could hinder
service performance rather than improve it. Make sure you have a
rudimentary understanding of what prompting is and what it does before
embarking on your quest.
<br /><br />
<b>2) Prompt interferes with context window :</b> This is a good one to keep in mind. Though it will
likely never be an issue for the average user, advanced
power users may find a point in which a lengthy prompt
causes a model to *only* output erroneous data. Keeping
your prompt clear and concise should be the goal of any
power user.
<br /><br />
<b>3) Test, test, and test again :</b> This is the most important step. The true essence of trial and error
is found here. Attempting different variations, structures, and wordings
of the same prompt can lead to vastly different outcomes, all coinciding
with the previously discussed points.
</div>
<br />
The aforementioned resources are as follows, in an order that we'd suggest approaching this topic with :
<div style="padding: 10px 10px 0;">
1) <a href="https://github.blog/ai-and-ml/generative-ai/prompt-engineering-guide-generative-ai-llms/" target="_blank">What is prompting</a>
<br />
2) <a href="https://github.com/tghurair/agentic-prompting/tree/main/techniques" target="_blank">Basic prompting examples</a>
<br />
3) <a href="https://www.promptingguide.ai/models" target="_blank">Model-specific prompting tips</a>
</div>
</span>
},
{
title: "Modules",
content:
<span>
Modules are a product that we offer outside of being a convenient host and frontend for a wide array of hand-picked open source LLMs.
They can be created using a fraction of our available <a onclick={ () => selectPage( pages[ 5 ] ) }>api</a>, and still create a lively environment for any
chatbot, website, video game dialog, or any other endeavour only the mind can uncover.
<br />
At the moment, our pricing for module implementation to your service starts at $250 USD, and of course goes up with project scope.
</span>
},
{
title: "Tools",
content:
<span>
To not repeat ourselves too much here, we'd suggest reading #4 of <a onclick={ () => selectPage( pages[ 1 ] ) }>effective chatting</a> before this portion.
<br /><br />
As stated there, our provided tooling is initiated automatically by the will of the selected model, but you are in charge
of managing its resource consumption. If you notice it taking a lot of notes, it will be worthwhile to clean out notes that
aren't so important. If your current conversation has a lot of web requests in it's history, it could prove resourceful to
start a new chat to initiate a new context window to refreshing the models "short-term memory", while carrying over useful
notes from past conversations. These nuanced tweaks will become frictionless and scale overtime to further hone in the model
to become tailored to you, the user.
</span>
},
{
title: "API",
content:
<span>
Our OpenAI-compatible API is the core that powers this entire site.
As you can see for yourself in the inspector, this site is written completely with an in-house framework.
None of the nonsense that plagues the modern industry. We understand the importance of simplicty.
What makes this all possible, outside of our ability to "Make It Work" as developers, is our robust API.
To dig deeper and become a power user, please visit <a onclick={ () => JSX.navigate( "/api" ) }>this</a> page.
</span>
}
];
let selected_page: TutorialPage = pages[ 0 ];
export default function Tutorial() {
return <Page>
<GroupBox title="Tutorial" style="width: 85%; display: flex;">
<div id="page-selector-wrapper">
<Dropdown title={ selected_page.title } inline id="tutorial-links-box">
{ pages.map( ( p ) => <DropdownItem onclick={ () => selectPage( p ) }> { p.title } </DropdownItem> ) }
</Dropdown>
</div>
<div class="tutorial-section">
<span id="tutorial-content">
{ selected_page.content }
</span>
</div>
</GroupBox>
</Page>
}
function selectPage( page: TutorialPage ) {
selected_page = page;
$( "#tutorial-links-box" ).text( page.title ); // moneyjsx todo @nave : FIX PLEASE, I SHOULDN'T HAVE TO DO THIS ( IT'S BROKEN ON MODEL PAGE AS WELL ) -- intuitive functionality is that it rerenders when the selected_page var is modified
$( "#tutorial-content" ).html( page.content ); // if we could add a reactive body to that as well that responds when selection changed, we could remove this entire need for onclick, but that's also probably a fuck ton of work .
}
|
