Skip to content

Image improvements #391

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: main
Choose a base branch
from
+180 −89
Open

Image improvements #391

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
1132a62
Remove Codeplay logo from slides
DuncanMcBain Apr 15, 2025
8468f40
Replace PNG images with SVGs
DuncanMcBain Apr 22, 2025
5c3848d
Change trademarks SVG to HTML element
DuncanMcBain Apr 28, 2025
b890b9b
Update with review feedback
DuncanMcBain Apr 28, 2025
a11ad14
Fix formatting of bullet point
DuncanMcBain Apr 29, 2025
acaea74
Managing Data: fit a table within slide boundaries
rafbiels Apr 29, 2025
6750cbe
Add back notes about what SYCL doesn't need
DuncanMcBain Apr 29, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions Lesson_Materials/Advanced_Data_Flow/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down Expand Up @@ -213,7 +212,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/uninitialized_buffer.png "SYCL")
![SYCL](../common-revealjs/images/uninitialized_buffer.svg "SYCL")
</div>
<div class="col" data-markdown>
* Here we have an example of using these techniques:
Expand Down
2 changes: 1 addition & 1 deletion Lesson_Materials/Asynchronous_Execution/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down
3 changes: 1 addition & 2 deletions Lesson_Materials/Coalesced_Global_Memory/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down
2 changes: 1 addition & 1 deletion Lesson_Materials/Data_Parallelism/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox" data-markdown>
Expand Down
12 changes: 6 additions & 6 deletions Lesson_Materials/Data_and_Dependencies/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down Expand Up @@ -94,7 +94,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/data_dependency.png "SYCL")
![SYCL](../common-revealjs/images/data_dependency.svg "SYCL")
</div>
<div class="col" data-markdown>
* Kernel A first writes to the data
Expand All @@ -111,7 +111,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/data_movement.png "SYCL")
![SYCL](../common-revealjs/images/data_movement.svg "SYCL")
</div>
<div class="col" data-markdown>
* Here both kernel functions are enqueued to the same device, in this case a GPU
Expand All @@ -128,7 +128,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/data_flow.png "SYCL")
![SYCL](../common-revealjs/images/data_flow.svg "SYCL")
</div>
<div class="col" data-markdown>
* Combining kernel function dependencies and the data movement dependencies we have a final data flow graph
Expand Down Expand Up @@ -406,7 +406,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/concurrent_data_flow.png "SYCL")
![SYCL](../common-revealjs/images/concurrent_data_flow.svg "SYCL")
</div>
<div class="col" data-markdown>
* If two kernels are accessing different buffers then there is no dependency between them
Expand Down Expand Up @@ -562,7 +562,7 @@
Code_Exercises/Data_and_Dependencies/source
</div>
<div class="container" data-markdown>
![SYCL](../common-revealjs/images/diamond_data_flow.png "SYCL")
![SYCL](../common-revealjs/images/diamond_data_flow.svg "SYCL")
</div>
<div class="container" data-markdown>
Put together what you've seen here to create the above diamond data flow graph in either buffer/accessor or USM data management models
Expand Down
2 changes: 1 addition & 1 deletion Lesson_Materials/Device_Discovery/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down
10 changes: 5 additions & 5 deletions Lesson_Materials/Enqueueing_a_Kernel/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section>
Expand Down Expand Up @@ -99,7 +99,7 @@
<div class="container">
<div class="col">
<div class="col-left-1" data-markdown>
![SYCL](../common-revealjs/images/command_group.png "SYCL")
![SYCL](../common-revealjs/images/command_group.svg "SYCL")
</div>
</div>
<div class="col" data-markdown>
Expand All @@ -119,7 +119,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/composing_a_command_group.png "SYCL")
![SYCL](../common-revealjs/images/composing_a_command_group.svg "SYCL")
</div>
<div class="col" data-markdown>
* Command groups are composed by calling the `submit` member function on a `queue`.
Expand Down Expand Up @@ -202,7 +202,7 @@
#### Scheduling
</div>
<div class="container" data-markdown>
![SYCL](../common-revealjs/images/scheduling.png "SYCL")
![SYCL](../common-revealjs/images/scheduling.svg "SYCL")
</div>
<div class="container" data-markdown>
* Once `submit` has created a command group it will submit it to the scheduler.
Expand All @@ -217,7 +217,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/common_scheduler.png "SYCL")
![SYCL](../common-revealjs/images/common_scheduler.svg "SYCL")
</div>
</div>
<div class="container" data-markdown>
Expand Down
9 changes: 4 additions & 5 deletions Lesson_Materials/Fast_Track/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down Expand Up @@ -207,7 +206,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/out_of_order_execution.png "SYCL")
![SYCL](../common-revealjs/images/out_of_order_execution.svg "SYCL")
</div>
<div class="col" data-markdown>
* Commands are submitted to devices in SYCL by means of a Queue
Expand All @@ -223,7 +222,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/in_order_execution.png "SYCL")
![SYCL](../common-revealjs/images/in_order_execution.svg "SYCL")
</div>
<div class="col" data-markdown>
* SYCL `queue`s can be configured to be in-order.
Expand Down Expand Up @@ -604,7 +603,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/image_convolution_data_flow.png "SYCL")
![SYCL](../common-revealjs/images/image_convolution_data_flow.svg "SYCL")
</div>
<div class="col" data-markdown>
* The kernel must read from the input image data and writes to the output image data.
Expand Down
2 changes: 1 addition & 1 deletion Lesson_Materials/Handling_Errors/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox" data-markdown>
Expand Down
5 changes: 2 additions & 3 deletions Lesson_Materials/Image_Convolution/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down Expand Up @@ -135,7 +134,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/image_convolution_data_flow.png "SYCL")
![SYCL](../common-revealjs/images/image_convolution_data_flow.svg "SYCL")
</div>
<div class="col" data-markdown>
* We have a single kernel function.
Expand Down
9 changes: 4 additions & 5 deletions Lesson_Materials/In_Order_Queue/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand All @@ -70,7 +69,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/out_of_order_execution.png "SYCL")
![SYCL](../common-revealjs/images/out_of_order_execution.svg "SYCL")
</div>
<div class="col" data-markdown>
* SYCL `queue`s are by default out-of-order.
Expand All @@ -85,7 +84,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/in_order_execution.png "SYCL")
![SYCL](../common-revealjs/images/in_order_execution.svg "SYCL")
</div>
<div class="col" data-markdown>
* SYCL `queue`s can be configured to be in-order.
Expand Down Expand Up @@ -224,7 +223,7 @@
Code_Exercises/In_Order_Queue/source_vector_add.cpp
</div>
<div class="container" data-markdown>
![SYCL](../common-revealjs/images/in_order_diamond_data_flow.png "SYCL")
![SYCL](../common-revealjs/images/in_order_diamond_data_flow.svg "SYCL")
</div>
<div class="container" data-markdown>
Take the diamond data flow graph we implemented in the last exercise and convert it to use an in-order `queue`.
Expand Down
22 changes: 15 additions & 7 deletions Lesson_Materials/Introduction_to_USM/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down Expand Up @@ -86,7 +86,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/unified_virtual_address_space.png "SYCL")
![SYCL](../common-revealjs/images/unified_virtual_address_space.svg "SYCL")
</div>
<div class="col" data-markdown>
* USM memory allocations return pointers which are consistent between the host application and kernel functions on a device
Expand All @@ -102,7 +102,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/pointer_based_structures.png "SYCL")
![SYCL](../common-revealjs/images/pointer_based_structures.svg "SYCL")
</div>
<div class="col" data-markdown>
* Data is moved between the host and device(s) in a span of memory in bytes rather than a buffer of a specific type
Expand All @@ -118,7 +118,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/explicit_data_movement.png "SYCL")
![SYCL](../common-revealjs/images/explicit_data_movement.svg "SYCL")
</div>
<div class="col" data-markdown>
* Memory is allocated and data is moved using explicit routines
Expand All @@ -134,7 +134,7 @@
</div>
<div class="container">
<div class="col" data-markdown>
![SYCL](../common-revealjs/images/shared_memory.png "SYCL")
![SYCL](../common-revealjs/images/shared_memory.svg "SYCL")
</div>
<div class="col" data-markdown>
* Some platforms will support variants of USM where memory allocations share the same memory region between the host and device(s)
Expand Down Expand Up @@ -162,10 +162,18 @@
#### USM variants
</div>
<div class="container" data-markdown>
USM has four variants which a platform can support with varying levels of support
USM has four variants which a platform can support with varying levels of support.
Only Explicit USM is guraranteed to be available, with the others optional.
</div>
<div class="container" data-markdown>
![SYCL](../common-revealjs/images/usm_variants.png "SYCL")
| | Explicit USM | Restricted USM | Concurrent USM | System USM |
|------------------------|--------------|----------------|----------------|------------|
| Consistent pointers | ✓ | ✓ | ✓ | ✓ |
| Pointers in structures | ✓ | ✓ | ✓ | ✓ |
| Explicit data movement | ✓ | ✓ | ✓ | ✓ |
| Shared allocations | ✗ | ✓ | ✓ | ✓ |
| Concurrent access | ✗ | ✗ | ✓ | ✓ |
| System allocations | ✗ | ✗ | ✗ | ✓ |
</div>
</section>
<!--Slide 10-->
Expand Down
3 changes: 1 addition & 2 deletions Lesson_Materials/Local_Memory_Tiling/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,7 @@
<div id="global-images" class="global-images">
<img src="../common-revealjs/images/sycl_academy.png" />
<img src="../common-revealjs/images/sycl_logo.png" />
<img src="../common-revealjs/images/trademarks.png" />
<img src="../common-revealjs/images/codeplay.png" />
<div class="trademarks">SYCL and the SYCL logo are trademarks of the Khronos Group Inc.</div>
</div>
<!--Slide 1-->
<section class="hbox">
Expand Down
Loading